@rivet-health/design-system 23.7.2 → 23.7.4
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/select/select/select.component.mjs +2 -2
- package/esm2020/lib/overlay/callout/callout.component.mjs +10 -5
- package/esm2020/lib/overlay/modal/modal.component.mjs +10 -5
- package/fesm2015/rivet-health-design-system.mjs +20 -10
- package/fesm2015/rivet-health-design-system.mjs.map +1 -1
- package/fesm2020/rivet-health-design-system.mjs +20 -10
- package/fesm2020/rivet-health-design-system.mjs.map +1 -1
- package/lib/overlay/callout/callout.component.d.ts +3 -1
- package/lib/overlay/modal/modal.component.d.ts +3 -1
- package/package.json +1 -1
|
@@ -49,10 +49,10 @@ export class SelectComponent extends InputLabelComponent {
|
|
|
49
49
|
}
|
|
50
50
|
}
|
|
51
51
|
SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
52
|
-
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectComponent, selector: "riv-select", inputs: { manager: "manager", disabled: "disabled", locked: "locked" }, queries: [{ propertyName: "triggerTemplate", first: true, predicate: ["trigger"], descendants: true }, { propertyName: "optionTemplate", first: true, predicate: ["option"], descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true }, { propertyName: "footerTemplate", first: true, predicate: ["footer"], descendants: true }], viewQueries: [{ propertyName: "customTriggerButton", first: true, predicate: ["customTriggerButton"], descendants: true }, { propertyName: "standardTriggerButton", first: true, predicate: ["standardTriggerButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"manager?.state | async; let s\">\n <ng-template #content>\n <riv-loading-cover [loading]=\"s.load.loading\">\n <div class=\"content-body\" [class.inline]=\"s.display.inline\">\n <header *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"headerTemplate; context: { state: s }\"\n ></ng-container>\n </header>\n <riv-search\n *ngIf=\"s.query.allowSearch\"\n [value]=\"s.query.search\"\n (valueChange)=\"\n manager?.actions?.next({ type: 'searchChange', payload: $event })\n \"\n ></riv-search>\n <div class=\"options\">\n <riv-select-node\n *ngIf=\"\n s.selection.allowMultiSelect &&\n s.selection.allowSelectAll &&\n !s.display.zeroStateMessage\n \"\n [mode]=\"'multi'\"\n [node]=\"{\n id: '__NOOP__',\n title: s.query.search ? 'Select all matching' : 'Select all',\n selected: s.selection.visibleSelectionState,\n selectable: true,\n expandable: false,\n expanded: false\n }\"\n (selectChange)=\"\n manager?.actions?.next({ type: 'visibleSelectedChange' })\n \"\n ></riv-select-node>\n <div\n *ngFor=\"let group of s.fullOptionGroups\"\n class=\"group\"\n [class.divider]=\"s.display.dividers\"\n >\n <span *ngIf=\"group.header; let header\" class=\"header\">\n {{ header }}\n </span>\n <ng-container *ngFor=\"let option of group.options\">\n <ng-container *ngIf=\"optionTemplate; else standardTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ node: option }\"\n ></ng-container>\n </ng-container>\n <ng-template #standardTemplate>\n <riv-select-node\n [mode]=\"s.selection.allowMultiSelect ? 'multi' : 'single'\"\n [node]=\"option\"\n [showSingleSelected]=\"s.display.showSingleSelected\"\n (selectChange)=\"\n selectChange(s.selection.allowMultiSelect, $event)\n \"\n (expandChange)=\"\n manager?.actions?.next({\n type: 'toggleOptionExpanded',\n id: $event\n })\n \"\n ></riv-select-node>\n </ng-template>\n </ng-container>\n </div>\n <span\n *ngIf=\"s.display.displayLimitMessage; let message\"\n class=\"display-limit\"\n >\n {{ message }}\n </span>\n <riv-zero-state\n *ngIf=\"s.display.zeroStateMessage; let message\"\n [message]=\"message\"\n ></riv-zero-state>\n </div>\n <footer *ngIf=\"footerTemplate\" class=\"custom-footer\">\n <ng-container\n *ngTemplateOutlet=\"footerTemplate; context: { state: s }\"\n ></ng-container>\n </footer>\n </div>\n </riv-loading-cover>\n </ng-template>\n\n <ng-container *ngIf=\"!s.display.inline; else content\">\n <ng-container *ngIf=\"triggerTemplate; else standardTrigger\">\n <button\n #customTriggerButton\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n [ngTemplateOutlet]=\"triggerTemplate\"\n [ngTemplateOutletContext]=\"{ state: s }\"\n ></ng-container>\n </button>\n </ng-container>\n <ng-template #standardTrigger>\n <riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n >\n <button\n #standardTriggerButton\n class=\"trigger\"\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n *ngIf=\"s.selection.selected.size; else placeholderValue\"\n >\n <span *ngIf=\"s.selection.selected.size > 1\" class=\"selected-count\">\n {{ s.selection.selected.size | rivNumber }}\n </span>\n <span class=\"value\">{{ s.display.selected }}</span>\n </ng-container>\n <ng-template #placeholderValue>\n <span class=\"value placeholder\">{{ s.display.placeholder }}</span>\n </ng-template>\n <span class=\"chevron\">\n <riv-icon\n *ngIf=\"!locked\"\n [name]=\"'ChevronDown'\"\n [size]=\"16\"\n ></riv-icon>\n <riv-icon *ngIf=\"locked\" [name]=\"'Lock'\" [size]=\"16\"></riv-icon>\n </span>\n </button>\n </riv-input-label>\n </ng-template>\n\n <ng-container *ngIf=\"s.display.open\">\n <riv-callout\n *riv-overlay\n [anchor]=\"getTrigger()\"\n [theme]=\"'light'\"\n [showCaret]=\"false\"\n [allowedPositions]=\"[\n 'top-left',\n 'top-center',\n 'top-right',\n 'bottom-right',\n 'bottom-center',\n 'bottom-left'\n ]\"\n (close)=\"manager?.actions?.next({ type: 'openChange', open: false })\"\n >\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n </riv-callout>\n </ng-container>\n </ng-container>\n</ng-container>\n", styles: [".trigger{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);display:flex;gap:var(--size-small);background-color:var(--surface-light-0);cursor:pointer;padding-left:var(--size-small)}.trigger:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.trigger:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1);cursor:default}.selected-count{font-size:var(--type-1-font-size);line-height:var(--type-1-line-height-0);font-weight:var(--font-weight-normal);color:var(--type-dark-body);border-radius:calc(var(--base-grid-size) * 3);background-color:var(--brand);padding:calc(var(--base-grid-size) / 4) calc(var(--base-grid-size) * 2);align-self:center}.value{font-size:var(--type-2-font-size);line-height:var(--type-2-line-height-0);color:var(--type-light-high-contrast);padding:var(--size-small) 0;flex-grow:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:pre}.value.placeholder{color:var(--type-light-disabled)}.chevron{display:flex;justify-content:center;align-items:center;padding:var(--size-small);background-color:var(--surface-light-2);border-left:var(--border-width) solid var(--border-light)}.content-body{padding:var(--size-large);display:flex;flex-direction:column;gap:var(--size-large)}.content-body:not(.inline){height:calc(var(--base-grid-size) * 120);max-height:50vh;width:calc(var(--base-grid-size) * 75);max-width:50vw}.options{flex-grow:1;overflow-y:auto;gap:var(--size-medium)}.options,.group{display:flex;flex-direction:column}.group{gap:var(--size-xsmall)}.group.divider:not(:last-child){padding-bottom:var(--size-medium);border-bottom:var(--border-width) solid var(--border-light)}.display-limit{font:var(--body-small);color:var(--type-light-disabled);padding:var(--size-small);text-align:center}.header{font:var(--input-medium);color:var(--type-light-low-contrast);padding:var(--size-xsmall) 0}.custom-footer{padding-top:var(--size-large);border-top:var(--border-width) solid var(--border-light)}\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.IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }, { kind: "component", type: i4.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText"], outputs: ["labelAction"] }, { kind: "component", type: i5.LoadingCoverComponent, selector: "riv-loading-cover", inputs: ["loading", "loadingSize", "errorMessage"] }, { kind: "directive", type: i6.OverlayDirective, selector: "[riv-overlay]" }, { kind: "component", type: i7.SearchComponent, selector: "riv-search", inputs: ["placeholder", "name"] }, { kind: "component", type: i8.SelectNodeComponent, selector: "riv-select-node", inputs: ["mode", "node", "showSingleSelected"], outputs: ["selectChange", "expandChange"] }, { kind: "component", type: i9.ZeroStateComponent, selector: "riv-zero-state", inputs: ["message"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.NumberPipe, name: "rivNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
52
|
+
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectComponent, selector: "riv-select", inputs: { manager: "manager", disabled: "disabled", locked: "locked" }, queries: [{ propertyName: "triggerTemplate", first: true, predicate: ["trigger"], descendants: true }, { propertyName: "optionTemplate", first: true, predicate: ["option"], descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true }, { propertyName: "footerTemplate", first: true, predicate: ["footer"], descendants: true }], viewQueries: [{ propertyName: "customTriggerButton", first: true, predicate: ["customTriggerButton"], descendants: true }, { propertyName: "standardTriggerButton", first: true, predicate: ["standardTriggerButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"manager?.state | async; let s\">\n <ng-template #content>\n <riv-loading-cover [loading]=\"s.load.loading\">\n <div class=\"content-body\" [class.inline]=\"s.display.inline\">\n <header *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"headerTemplate; context: { state: s }\"\n ></ng-container>\n </header>\n <riv-search\n *ngIf=\"s.query.allowSearch\"\n [value]=\"s.query.search\"\n (valueChange)=\"\n manager?.actions?.next({ type: 'searchChange', payload: $event })\n \"\n ></riv-search>\n <div class=\"options\">\n <riv-select-node\n *ngIf=\"\n s.selection.allowMultiSelect &&\n s.selection.allowSelectAll &&\n !s.display.zeroStateMessage\n \"\n [mode]=\"'multi'\"\n [node]=\"{\n id: '__NOOP__',\n title: s.query.search ? 'Select all matching' : 'Select all',\n selected: s.selection.visibleSelectionState,\n selectable: true,\n expandable: false,\n expanded: false\n }\"\n (selectChange)=\"\n manager?.actions?.next({ type: 'visibleSelectedChange' })\n \"\n ></riv-select-node>\n <div\n *ngFor=\"let group of s.fullOptionGroups\"\n class=\"group\"\n [class.divider]=\"s.display.dividers\"\n >\n <span *ngIf=\"group.header; let header\" class=\"header\">\n {{ header }}\n </span>\n <ng-container *ngFor=\"let option of group.options\">\n <ng-container *ngIf=\"optionTemplate; else standardTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ node: option }\"\n ></ng-container>\n </ng-container>\n <ng-template #standardTemplate>\n <riv-select-node\n [mode]=\"s.selection.allowMultiSelect ? 'multi' : 'single'\"\n [node]=\"option\"\n [showSingleSelected]=\"s.display.showSingleSelected\"\n (selectChange)=\"\n selectChange(s.selection.allowMultiSelect, $event)\n \"\n (expandChange)=\"\n manager?.actions?.next({\n type: 'toggleOptionExpanded',\n id: $event\n })\n \"\n ></riv-select-node>\n </ng-template>\n </ng-container>\n </div>\n <span\n *ngIf=\"s.display.displayLimitMessage; let message\"\n class=\"display-limit\"\n >\n {{ message }}\n </span>\n <riv-zero-state\n *ngIf=\"s.display.zeroStateMessage; let message\"\n [message]=\"message\"\n ></riv-zero-state>\n </div>\n <footer *ngIf=\"footerTemplate\" class=\"custom-footer\">\n <ng-container\n *ngTemplateOutlet=\"footerTemplate; context: { state: s }\"\n ></ng-container>\n </footer>\n </div>\n </riv-loading-cover>\n </ng-template>\n\n <ng-container *ngIf=\"!s.display.inline; else content\">\n <ng-container *ngIf=\"triggerTemplate; else standardTrigger\">\n <button\n #customTriggerButton\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n [ngTemplateOutlet]=\"triggerTemplate\"\n [ngTemplateOutletContext]=\"{ state: s }\"\n ></ng-container>\n </button>\n </ng-container>\n <ng-template #standardTrigger>\n <riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n >\n <button\n #standardTriggerButton\n class=\"trigger\"\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n *ngIf=\"s.selection.selected.size; else placeholderValue\"\n >\n <span *ngIf=\"s.selection.selected.size > 1\" class=\"selected-count\">\n {{ s.selection.selected.size | rivNumber }}\n </span>\n <span class=\"value\">{{ s.display.selected }}</span>\n </ng-container>\n <ng-template #placeholderValue>\n <span class=\"value placeholder\">{{ s.display.placeholder }}</span>\n </ng-template>\n <span class=\"chevron\">\n <riv-icon\n *ngIf=\"!locked\"\n [name]=\"'ChevronDown'\"\n [size]=\"16\"\n ></riv-icon>\n <riv-icon *ngIf=\"locked\" [name]=\"'Lock'\" [size]=\"16\"></riv-icon>\n </span>\n </button>\n </riv-input-label>\n </ng-template>\n\n <ng-container *ngIf=\"s.display.open\">\n <riv-callout\n *riv-overlay\n [anchor]=\"getTrigger()\"\n [theme]=\"'light'\"\n [showCaret]=\"false\"\n [allowedPositions]=\"[\n 'top-left',\n 'top-center',\n 'top-right',\n 'bottom-right',\n 'bottom-center',\n 'bottom-left'\n ]\"\n (close)=\"manager?.actions?.next({ type: 'openChange', open: false })\"\n >\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n </riv-callout>\n </ng-container>\n </ng-container>\n</ng-container>\n", styles: [".trigger{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);display:flex;gap:var(--size-small);background-color:var(--surface-light-0);cursor:pointer;padding-left:var(--size-small)}.trigger:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.trigger:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1);cursor:default}.selected-count{font-size:var(--type-1-font-size);line-height:var(--type-1-line-height-0);font-weight:var(--font-weight-normal);color:var(--type-dark-body);border-radius:calc(var(--base-grid-size) * 3);background-color:var(--brand);padding:calc(var(--base-grid-size) / 4) calc(var(--base-grid-size) * 2);align-self:center}.value{font-size:var(--type-2-font-size);line-height:var(--type-2-line-height-0);color:var(--type-light-high-contrast);padding:var(--size-small) 0;flex-grow:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:pre}.value.placeholder{color:var(--type-light-disabled)}.chevron{display:flex;justify-content:center;align-items:center;padding:var(--size-small);background-color:var(--surface-light-2);border-left:var(--border-width) solid var(--border-light)}.content-body{padding:var(--size-large);display:flex;flex-direction:column;gap:var(--size-large)}.content-body:not(.inline){max-height:50vh;width:calc(var(--base-grid-size) * 75);max-width:50vw}.options{flex-grow:1;overflow-y:auto;gap:var(--size-medium)}.options,.group{display:flex;flex-direction:column}.group{gap:var(--size-xsmall)}.group.divider:not(:last-child){padding-bottom:var(--size-medium);border-bottom:var(--border-width) solid var(--border-light)}.display-limit{font:var(--body-small);color:var(--type-light-disabled);padding:var(--size-small);text-align:center}.header{font:var(--input-medium);color:var(--type-light-low-contrast);padding:var(--size-xsmall) 0}.custom-footer{padding-top:var(--size-large);border-top:var(--border-width) solid var(--border-light)}\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.IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }, { kind: "component", type: i4.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText"], outputs: ["labelAction"] }, { kind: "component", type: i5.LoadingCoverComponent, selector: "riv-loading-cover", inputs: ["loading", "loadingSize", "errorMessage"] }, { kind: "directive", type: i6.OverlayDirective, selector: "[riv-overlay]" }, { kind: "component", type: i7.SearchComponent, selector: "riv-search", inputs: ["placeholder", "name"] }, { kind: "component", type: i8.SelectNodeComponent, selector: "riv-select-node", inputs: ["mode", "node", "showSingleSelected"], outputs: ["selectChange", "expandChange"] }, { kind: "component", type: i9.ZeroStateComponent, selector: "riv-zero-state", inputs: ["message"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.NumberPipe, name: "rivNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
53
53
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectComponent, decorators: [{
|
|
54
54
|
type: Component,
|
|
55
|
-
args: [{ selector: 'riv-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"manager?.state | async; let s\">\n <ng-template #content>\n <riv-loading-cover [loading]=\"s.load.loading\">\n <div class=\"content-body\" [class.inline]=\"s.display.inline\">\n <header *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"headerTemplate; context: { state: s }\"\n ></ng-container>\n </header>\n <riv-search\n *ngIf=\"s.query.allowSearch\"\n [value]=\"s.query.search\"\n (valueChange)=\"\n manager?.actions?.next({ type: 'searchChange', payload: $event })\n \"\n ></riv-search>\n <div class=\"options\">\n <riv-select-node\n *ngIf=\"\n s.selection.allowMultiSelect &&\n s.selection.allowSelectAll &&\n !s.display.zeroStateMessage\n \"\n [mode]=\"'multi'\"\n [node]=\"{\n id: '__NOOP__',\n title: s.query.search ? 'Select all matching' : 'Select all',\n selected: s.selection.visibleSelectionState,\n selectable: true,\n expandable: false,\n expanded: false\n }\"\n (selectChange)=\"\n manager?.actions?.next({ type: 'visibleSelectedChange' })\n \"\n ></riv-select-node>\n <div\n *ngFor=\"let group of s.fullOptionGroups\"\n class=\"group\"\n [class.divider]=\"s.display.dividers\"\n >\n <span *ngIf=\"group.header; let header\" class=\"header\">\n {{ header }}\n </span>\n <ng-container *ngFor=\"let option of group.options\">\n <ng-container *ngIf=\"optionTemplate; else standardTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ node: option }\"\n ></ng-container>\n </ng-container>\n <ng-template #standardTemplate>\n <riv-select-node\n [mode]=\"s.selection.allowMultiSelect ? 'multi' : 'single'\"\n [node]=\"option\"\n [showSingleSelected]=\"s.display.showSingleSelected\"\n (selectChange)=\"\n selectChange(s.selection.allowMultiSelect, $event)\n \"\n (expandChange)=\"\n manager?.actions?.next({\n type: 'toggleOptionExpanded',\n id: $event\n })\n \"\n ></riv-select-node>\n </ng-template>\n </ng-container>\n </div>\n <span\n *ngIf=\"s.display.displayLimitMessage; let message\"\n class=\"display-limit\"\n >\n {{ message }}\n </span>\n <riv-zero-state\n *ngIf=\"s.display.zeroStateMessage; let message\"\n [message]=\"message\"\n ></riv-zero-state>\n </div>\n <footer *ngIf=\"footerTemplate\" class=\"custom-footer\">\n <ng-container\n *ngTemplateOutlet=\"footerTemplate; context: { state: s }\"\n ></ng-container>\n </footer>\n </div>\n </riv-loading-cover>\n </ng-template>\n\n <ng-container *ngIf=\"!s.display.inline; else content\">\n <ng-container *ngIf=\"triggerTemplate; else standardTrigger\">\n <button\n #customTriggerButton\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n [ngTemplateOutlet]=\"triggerTemplate\"\n [ngTemplateOutletContext]=\"{ state: s }\"\n ></ng-container>\n </button>\n </ng-container>\n <ng-template #standardTrigger>\n <riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n >\n <button\n #standardTriggerButton\n class=\"trigger\"\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n *ngIf=\"s.selection.selected.size; else placeholderValue\"\n >\n <span *ngIf=\"s.selection.selected.size > 1\" class=\"selected-count\">\n {{ s.selection.selected.size | rivNumber }}\n </span>\n <span class=\"value\">{{ s.display.selected }}</span>\n </ng-container>\n <ng-template #placeholderValue>\n <span class=\"value placeholder\">{{ s.display.placeholder }}</span>\n </ng-template>\n <span class=\"chevron\">\n <riv-icon\n *ngIf=\"!locked\"\n [name]=\"'ChevronDown'\"\n [size]=\"16\"\n ></riv-icon>\n <riv-icon *ngIf=\"locked\" [name]=\"'Lock'\" [size]=\"16\"></riv-icon>\n </span>\n </button>\n </riv-input-label>\n </ng-template>\n\n <ng-container *ngIf=\"s.display.open\">\n <riv-callout\n *riv-overlay\n [anchor]=\"getTrigger()\"\n [theme]=\"'light'\"\n [showCaret]=\"false\"\n [allowedPositions]=\"[\n 'top-left',\n 'top-center',\n 'top-right',\n 'bottom-right',\n 'bottom-center',\n 'bottom-left'\n ]\"\n (close)=\"manager?.actions?.next({ type: 'openChange', open: false })\"\n >\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n </riv-callout>\n </ng-container>\n </ng-container>\n</ng-container>\n", styles: [".trigger{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);display:flex;gap:var(--size-small);background-color:var(--surface-light-0);cursor:pointer;padding-left:var(--size-small)}.trigger:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.trigger:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1);cursor:default}.selected-count{font-size:var(--type-1-font-size);line-height:var(--type-1-line-height-0);font-weight:var(--font-weight-normal);color:var(--type-dark-body);border-radius:calc(var(--base-grid-size) * 3);background-color:var(--brand);padding:calc(var(--base-grid-size) / 4) calc(var(--base-grid-size) * 2);align-self:center}.value{font-size:var(--type-2-font-size);line-height:var(--type-2-line-height-0);color:var(--type-light-high-contrast);padding:var(--size-small) 0;flex-grow:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:pre}.value.placeholder{color:var(--type-light-disabled)}.chevron{display:flex;justify-content:center;align-items:center;padding:var(--size-small);background-color:var(--surface-light-2);border-left:var(--border-width) solid var(--border-light)}.content-body{padding:var(--size-large);display:flex;flex-direction:column;gap:var(--size-large)}.content-body:not(.inline){
|
|
55
|
+
args: [{ selector: 'riv-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"manager?.state | async; let s\">\n <ng-template #content>\n <riv-loading-cover [loading]=\"s.load.loading\">\n <div class=\"content-body\" [class.inline]=\"s.display.inline\">\n <header *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"headerTemplate; context: { state: s }\"\n ></ng-container>\n </header>\n <riv-search\n *ngIf=\"s.query.allowSearch\"\n [value]=\"s.query.search\"\n (valueChange)=\"\n manager?.actions?.next({ type: 'searchChange', payload: $event })\n \"\n ></riv-search>\n <div class=\"options\">\n <riv-select-node\n *ngIf=\"\n s.selection.allowMultiSelect &&\n s.selection.allowSelectAll &&\n !s.display.zeroStateMessage\n \"\n [mode]=\"'multi'\"\n [node]=\"{\n id: '__NOOP__',\n title: s.query.search ? 'Select all matching' : 'Select all',\n selected: s.selection.visibleSelectionState,\n selectable: true,\n expandable: false,\n expanded: false\n }\"\n (selectChange)=\"\n manager?.actions?.next({ type: 'visibleSelectedChange' })\n \"\n ></riv-select-node>\n <div\n *ngFor=\"let group of s.fullOptionGroups\"\n class=\"group\"\n [class.divider]=\"s.display.dividers\"\n >\n <span *ngIf=\"group.header; let header\" class=\"header\">\n {{ header }}\n </span>\n <ng-container *ngFor=\"let option of group.options\">\n <ng-container *ngIf=\"optionTemplate; else standardTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ node: option }\"\n ></ng-container>\n </ng-container>\n <ng-template #standardTemplate>\n <riv-select-node\n [mode]=\"s.selection.allowMultiSelect ? 'multi' : 'single'\"\n [node]=\"option\"\n [showSingleSelected]=\"s.display.showSingleSelected\"\n (selectChange)=\"\n selectChange(s.selection.allowMultiSelect, $event)\n \"\n (expandChange)=\"\n manager?.actions?.next({\n type: 'toggleOptionExpanded',\n id: $event\n })\n \"\n ></riv-select-node>\n </ng-template>\n </ng-container>\n </div>\n <span\n *ngIf=\"s.display.displayLimitMessage; let message\"\n class=\"display-limit\"\n >\n {{ message }}\n </span>\n <riv-zero-state\n *ngIf=\"s.display.zeroStateMessage; let message\"\n [message]=\"message\"\n ></riv-zero-state>\n </div>\n <footer *ngIf=\"footerTemplate\" class=\"custom-footer\">\n <ng-container\n *ngTemplateOutlet=\"footerTemplate; context: { state: s }\"\n ></ng-container>\n </footer>\n </div>\n </riv-loading-cover>\n </ng-template>\n\n <ng-container *ngIf=\"!s.display.inline; else content\">\n <ng-container *ngIf=\"triggerTemplate; else standardTrigger\">\n <button\n #customTriggerButton\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n [ngTemplateOutlet]=\"triggerTemplate\"\n [ngTemplateOutletContext]=\"{ state: s }\"\n ></ng-container>\n </button>\n </ng-container>\n <ng-template #standardTrigger>\n <riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n >\n <button\n #standardTriggerButton\n class=\"trigger\"\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n *ngIf=\"s.selection.selected.size; else placeholderValue\"\n >\n <span *ngIf=\"s.selection.selected.size > 1\" class=\"selected-count\">\n {{ s.selection.selected.size | rivNumber }}\n </span>\n <span class=\"value\">{{ s.display.selected }}</span>\n </ng-container>\n <ng-template #placeholderValue>\n <span class=\"value placeholder\">{{ s.display.placeholder }}</span>\n </ng-template>\n <span class=\"chevron\">\n <riv-icon\n *ngIf=\"!locked\"\n [name]=\"'ChevronDown'\"\n [size]=\"16\"\n ></riv-icon>\n <riv-icon *ngIf=\"locked\" [name]=\"'Lock'\" [size]=\"16\"></riv-icon>\n </span>\n </button>\n </riv-input-label>\n </ng-template>\n\n <ng-container *ngIf=\"s.display.open\">\n <riv-callout\n *riv-overlay\n [anchor]=\"getTrigger()\"\n [theme]=\"'light'\"\n [showCaret]=\"false\"\n [allowedPositions]=\"[\n 'top-left',\n 'top-center',\n 'top-right',\n 'bottom-right',\n 'bottom-center',\n 'bottom-left'\n ]\"\n (close)=\"manager?.actions?.next({ type: 'openChange', open: false })\"\n >\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n </riv-callout>\n </ng-container>\n </ng-container>\n</ng-container>\n", styles: [".trigger{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);display:flex;gap:var(--size-small);background-color:var(--surface-light-0);cursor:pointer;padding-left:var(--size-small)}.trigger:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.trigger:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1);cursor:default}.selected-count{font-size:var(--type-1-font-size);line-height:var(--type-1-line-height-0);font-weight:var(--font-weight-normal);color:var(--type-dark-body);border-radius:calc(var(--base-grid-size) * 3);background-color:var(--brand);padding:calc(var(--base-grid-size) / 4) calc(var(--base-grid-size) * 2);align-self:center}.value{font-size:var(--type-2-font-size);line-height:var(--type-2-line-height-0);color:var(--type-light-high-contrast);padding:var(--size-small) 0;flex-grow:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:pre}.value.placeholder{color:var(--type-light-disabled)}.chevron{display:flex;justify-content:center;align-items:center;padding:var(--size-small);background-color:var(--surface-light-2);border-left:var(--border-width) solid var(--border-light)}.content-body{padding:var(--size-large);display:flex;flex-direction:column;gap:var(--size-large)}.content-body:not(.inline){max-height:50vh;width:calc(var(--base-grid-size) * 75);max-width:50vw}.options{flex-grow:1;overflow-y:auto;gap:var(--size-medium)}.options,.group{display:flex;flex-direction:column}.group{gap:var(--size-xsmall)}.group.divider:not(:last-child){padding-bottom:var(--size-medium);border-bottom:var(--border-width) solid var(--border-light)}.display-limit{font:var(--body-small);color:var(--type-light-disabled);padding:var(--size-small);text-align:center}.header{font:var(--input-medium);color:var(--type-light-low-contrast);padding:var(--size-xsmall) 0}.custom-footer{padding-top:var(--size-large);border-top:var(--border-width) solid var(--border-light)}\n"] }]
|
|
56
56
|
}], propDecorators: { manager: [{
|
|
57
57
|
type: Input
|
|
58
58
|
}], disabled: [{
|
|
@@ -20,15 +20,20 @@ export class CalloutComponent {
|
|
|
20
20
|
this.theme = 'dark';
|
|
21
21
|
this.content = null;
|
|
22
22
|
this.scrim = null;
|
|
23
|
+
this.mouseDownStartedInScrim = false;
|
|
23
24
|
this.left = 0;
|
|
24
25
|
this.top = 0;
|
|
25
26
|
this.resolvedPosition = this.preferredPosition;
|
|
26
27
|
this.close = new EventEmitter();
|
|
27
28
|
}
|
|
28
|
-
|
|
29
|
-
|
|
29
|
+
onScrimMouseDown(evt) {
|
|
30
|
+
this.mouseDownStartedInScrim = evt.target === evt.currentTarget;
|
|
31
|
+
}
|
|
32
|
+
onScrimMouseUp(evt) {
|
|
33
|
+
if (this.mouseDownStartedInScrim && evt.target === evt.currentTarget) {
|
|
30
34
|
this.close.emit();
|
|
31
35
|
}
|
|
36
|
+
this.mouseDownStartedInScrim = false;
|
|
32
37
|
}
|
|
33
38
|
ngAfterViewInit() {
|
|
34
39
|
this.setPosition();
|
|
@@ -65,10 +70,10 @@ export class CalloutComponent {
|
|
|
65
70
|
}
|
|
66
71
|
}
|
|
67
72
|
CalloutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalloutComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
68
|
-
CalloutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CalloutComponent, selector: "riv-callout", inputs: { anchor: "anchor", isModal: "isModal", preferredPosition: "preferredPosition", allowedPositions: "allowedPositions", fallbackDirection: "fallbackDirection", showCaret: "showCaret", theme: "theme" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }, { propertyName: "scrim", first: true, predicate: ["scrim"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div
|
|
73
|
+
CalloutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CalloutComponent, selector: "riv-callout", inputs: { anchor: "anchor", isModal: "isModal", preferredPosition: "preferredPosition", allowedPositions: "allowedPositions", fallbackDirection: "fallbackDirection", showCaret: "showCaret", theme: "theme" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }, { propertyName: "scrim", first: true, predicate: ["scrim"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n #scrim\n class=\"scrim\"\n [class.full]=\"isModal\"\n (mousedown)=\"onScrimMouseDown($event)\"\n (mouseup)=\"onScrimMouseUp($event)\"\n (touchstart)=\"onScrimMouseDown($event)\"\n (touchend)=\"onScrimMouseUp($event)\"\n>\n <div\n class=\"callout\"\n [ngClass]=\"[theme, resolvedPosition]\"\n [class.caret]=\"showCaret\"\n [style.left.px]=\"left\"\n [style.top.px]=\"top\"\n [rivLockScroll]=\"isModal\"\n #content\n >\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".scrim{position:fixed;z-index:var(--callout-z-index);cursor:default;top:0;right:0;left:0}.scrim.full{bottom:0}.callout{position:absolute;background-color:var(--background-color);border:var(--border-width) solid var(--border-color);border-radius:var(--border-radius-medium);color:var(--text-color);box-shadow:var(--depth-2)}.callout.dark{--background-color: var(--surface-dark-0);--border-color: var(--border-dark);--text-color: var(--type-dark-high-contrast)}.callout.light{--background-color: var(--surface-light-0);--border-color: var(--border-light);--text-color: var(--type-light-high-contrast)}.callout.caret:after{--size: 11px;content:\"\";width:var(--size);height:var(--size);position:absolute;background-color:var(--background-color);border-left:var(--border-width) solid var(--border-color);border-bottom:var(--border-width) solid var(--border-color)}.callout.caret.top-left:after{right:var(--size-large);bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.top-center:after{left:50%;bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.top-right:after{left:var(--size-large);bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.right-top:after{top:var(--size-large);left:0;transform:translate(-50%,-50%) rotate(45deg)}.callout.caret.center-right:after{top:50%;left:0;transform:translate(-50%,-50%) rotate(45deg)}.callout.caret.right-bottom:after{left:0;bottom:var(--size-large);transform:translate(-50%,50%) rotate(45deg)}.callout.caret.bottom-right:after{top:0;left:var(--size-large);transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.bottom-center:after{top:0;left:50%;transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.bottom-left:after{top:0;right:var(--size-large);transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.left-bottom:after{right:0;bottom:var(--size-large);transform:translate(50%,50%) rotate(225deg)}.callout.caret.center-left:after{top:50%;right:0;transform:translate(50%,-50%) rotate(225deg)}.callout.caret.left-top:after{top:var(--size-large);right:0;transform:translate(50%,-50%) rotate(225deg)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.LockScrollDirective, selector: "[rivLockScroll]", inputs: ["rivLockScroll"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
69
74
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalloutComponent, decorators: [{
|
|
70
75
|
type: Component,
|
|
71
|
-
args: [{ selector: 'riv-callout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div
|
|
76
|
+
args: [{ selector: 'riv-callout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n #scrim\n class=\"scrim\"\n [class.full]=\"isModal\"\n (mousedown)=\"onScrimMouseDown($event)\"\n (mouseup)=\"onScrimMouseUp($event)\"\n (touchstart)=\"onScrimMouseDown($event)\"\n (touchend)=\"onScrimMouseUp($event)\"\n>\n <div\n class=\"callout\"\n [ngClass]=\"[theme, resolvedPosition]\"\n [class.caret]=\"showCaret\"\n [style.left.px]=\"left\"\n [style.top.px]=\"top\"\n [rivLockScroll]=\"isModal\"\n #content\n >\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".scrim{position:fixed;z-index:var(--callout-z-index);cursor:default;top:0;right:0;left:0}.scrim.full{bottom:0}.callout{position:absolute;background-color:var(--background-color);border:var(--border-width) solid var(--border-color);border-radius:var(--border-radius-medium);color:var(--text-color);box-shadow:var(--depth-2)}.callout.dark{--background-color: var(--surface-dark-0);--border-color: var(--border-dark);--text-color: var(--type-dark-high-contrast)}.callout.light{--background-color: var(--surface-light-0);--border-color: var(--border-light);--text-color: var(--type-light-high-contrast)}.callout.caret:after{--size: 11px;content:\"\";width:var(--size);height:var(--size);position:absolute;background-color:var(--background-color);border-left:var(--border-width) solid var(--border-color);border-bottom:var(--border-width) solid var(--border-color)}.callout.caret.top-left:after{right:var(--size-large);bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.top-center:after{left:50%;bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.top-right:after{left:var(--size-large);bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.right-top:after{top:var(--size-large);left:0;transform:translate(-50%,-50%) rotate(45deg)}.callout.caret.center-right:after{top:50%;left:0;transform:translate(-50%,-50%) rotate(45deg)}.callout.caret.right-bottom:after{left:0;bottom:var(--size-large);transform:translate(-50%,50%) rotate(45deg)}.callout.caret.bottom-right:after{top:0;left:var(--size-large);transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.bottom-center:after{top:0;left:50%;transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.bottom-left:after{top:0;right:var(--size-large);transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.left-bottom:after{right:0;bottom:var(--size-large);transform:translate(50%,50%) rotate(225deg)}.callout.caret.center-left:after{top:50%;right:0;transform:translate(50%,-50%) rotate(225deg)}.callout.caret.left-top:after{top:var(--size-large);right:0;transform:translate(50%,-50%) rotate(225deg)}\n"] }]
|
|
72
77
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { anchor: [{
|
|
73
78
|
type: Input
|
|
74
79
|
}], isModal: [{
|
|
@@ -110,4 +115,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
110
115
|
];
|
|
111
116
|
CalloutComponent.Directions = ['clockwise', 'counter-clockwise'];
|
|
112
117
|
})(CalloutComponent || (CalloutComponent = {}));
|
|
113
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FsbG91dC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9yaXYvc3JjL2xpYi9vdmVybGF5L2NhbGxvdXQvY2FsbG91dC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9yaXYvc3JjL2xpYi9vdmVybGF5L2NhbGxvdXQvY2FsbG91dC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBRUwsdUJBQXVCLEVBRXZCLFNBQVMsRUFFVCxZQUFZLEVBQ1osS0FBSyxFQUVMLE1BQU0sRUFDTixTQUFTLEdBQ1YsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLG1CQUFtQixDQUFDOzs7O0FBRTlDLDZFQUE2RTtBQUM3RSxzQ0FBc0M7QUFDdEMsbUdBQW1HO0FBT25HLE1BQU0sT0FBTyxnQkFBZ0I7SUFDM0IsWUFBNkIsR0FBc0I7UUFBdEIsUUFBRyxHQUFILEdBQUcsQ0FBbUI7UUFHbkQsV0FBTSxHQUE2QixJQUFJLENBQUM7UUFHeEMsWUFBTyxHQUFZLElBQUksQ0FBQztRQUd4QixzQkFBaUIsR0FBc0MsY0FBYyxDQUFDO1FBR3RFLHFCQUFnQixHQUF3QztZQUN0RCxHQUFHLGdCQUFnQixDQUFDLGlCQUFpQjtTQUN0QyxDQUFDO1FBR0Ysc0JBQWlCLEdBQStCLG1CQUFtQixDQUFDO1FBR3BFLGNBQVMsR0FBWSxJQUFJLENBQUM7UUFHMUIsVUFBSyxHQUEyQixNQUFNLENBQUM7UUFHdkMsWUFBTyxHQUFzQyxJQUFJLENBQUM7UUFHbEQsVUFBSyxHQUFtQyxJQUFJLENBQUM7UUFRN0MsU0FBSSxHQUFXLENBQUMsQ0FBQztRQUNqQixRQUFHLEdBQVcsQ0FBQyxDQUFDO1FBQ2hCLHFCQUFnQixHQUFzQyxJQUFJLENBQUMsaUJBQWlCLENBQUM7UUFzRHBFLFVBQUssR0FBRyxJQUFJLFlBQVksRUFB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QUFJVCxXQUFpQixnQkFBZ0I7SUFDbEIsdUJBQU0sR0FBRyxDQUFDLE9BQU8sRUFBRSxNQUFNLENBQVUsQ0FBQztJQUdwQyxrQ0FBaUIsR0FBRztRQUMvQixVQUFVO1FBQ1YsWUFBWTtRQUNaLFdBQVc7UUFDWCxXQUFXO1FBQ1gsY0FBYztRQUNkLGNBQWM7UUFDZCxjQUFjO1FBQ2QsZUFBZTtRQUNmLGFBQWE7UUFDYixhQUFhO1FBQ2IsYUFBYTtRQUNiLFVBQVU7S0FDRixDQUFDO0lBR0UsMkJBQVUsR0FBRyxDQUFDLFdBQVcsRUFBRSxtQkFBbUIsQ0FBVSxDQUFDO0FBRXhFLENBQUMsRUF0QmdCLGdCQUFnQixLQUFoQixnQkFBZ0IsUUFzQmhDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQWZ0ZXJWaWV3SW5pdCxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENoYW5nZURldGVjdG9yUmVmLFxuICBDb21wb25lbnQsXG4gIEVsZW1lbnRSZWYsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE9uQ2hhbmdlcyxcbiAgT3V0cHV0LFxuICBWaWV3Q2hpbGQsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgZ2V0T3JpZ2luIH0gZnJvbSAnLi9jYWxsb3V0LmhlbHBlcnMnO1xuXG4vLyBUT0RPOiBvbmNlIHdlIHVwZ3JhZGUgdG8gQW5ndWxhciAxNiwgdGhpcyBjb21wb25lbnQgY2FuIGJlIGNsZWFuZWQgdXAgd2l0aFxuLy8gc2lnbmFscyBpbnN0ZWFkIG9mIGxpZmVjeWNsZSBob29rcy5cbi8vIGh0dHBzOi8vd3d3Lm5vdGlvbi5zby9yaXZldC9SZXNvbHZlLVRPRE9zLWFmdGVyLUFuZ3VsYXItdXBncmFkZS0xZjI2NjdlYjJhMzE4MGI3OWY2YWQ5MmE3ZTU3NmYwOFxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAncml2LWNhbGxvdXQnLFxuICB0ZW1wbGF0ZVVybDogJy4vY2FsbG91dC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2NhbGxvdXQuY29tcG9uZW50LmNzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgQ2FsbG91dENvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQsIE9uQ2hhbmdlcyB7XG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgcmVhZG9ubHkgY2RyOiBDaGFuZ2VEZXRlY3RvclJlZikge31cblxuICBASW5wdXQoKVxuICBhbmNob3I6IEVsZW1lbnQgfCBET01SZWN0IHwgbnVsbCA9IG51bGw7XG5cbiAgQElucHV0KClcbiAgaXNNb2RhbDogYm9vbGVhbiA9IHRydWU7XG5cbiAgQElucHV0KClcbiAgcHJlZmVycmVkUG9zaXRpb246IENhbGxvdXRDb21wb25lbnQuQW5jaG9yZWRQb3NpdGlvbiA9ICdib3R0b20tcmlnaHQnO1xuXG4gIEBJbnB1dCgpXG4gIGFsbG93ZWRQb3NpdGlvbnM6IENhbGxvdXRDb21wb25lbnQuQW5jaG9yZWRQb3NpdGlvbltdID0gW1xuICAgIC4uLkNhbGxvdXRDb21wb25lbnQuQW5jaG9yZWRQb3NpdGlvbnMsXG4gIF07XG5cbiAgQElucHV0KClcbiAgZmFsbGJhY2tEaXJlY3Rpb246IENhbGxvdXRDb21wb25lbnQuRGlyZWN0aW9uID0gJ2NvdW50ZXItY2xvY2t3aXNlJztcblxuICBASW5wdXQoKVxuICBzaG93Q2FyZXQ6IGJvb2xlYW4gPSB0cnVlO1xuXG4gIEBJbnB1dCgpXG4gIHRoZW1lOiBDYWxsb3V0Q29tcG9uZW50LlRoZW1lID0gJ2RhcmsnO1xuXG4gIEBWaWV3Q2hpbGQoJ2NvbnRlbnQnKVxuICBjb250ZW50OiBFbGVtZW50UmVmPEhUTUxEaXZFbGVtZW50PiB8IG51bGwgPSBudWxsO1xuXG4gIEBWaWV3Q2hpbGQoJ3NjcmltJywgeyBzdGF0aWM6IGZhbHNlIH0pXG4gIHNjcmltOiBFbGVtZW50UmVmPEhUTUxFbGVtZW50PiB8IG51bGwgPSBudWxsO1xuXG4gIHNjcmltQ2xpY2soZXZ0OiBNb3VzZUV2ZW50KSB7XG4gICAgaWYgKGV2dC50YXJnZXQgPT09IGV2dC5jdXJyZW50VGFyZ2V0KSB7XG4gICAgICB0aGlzLmNsb3NlLmVtaXQoKTtcbiAgICB9XG4gIH1cblxuICBsZWZ0OiBudW1iZXIgPSAwO1xuICB0b3A6IG51bWJlciA9IDA7XG4gIHJlc29sdmVkUG9zaXRpb246IENhbGxvdXRDb21wb25lbnQuQW5jaG9yZWRQb3NpdGlvbiA9IHRoaXMucHJlZmVycmVkUG9zaXRpb247XG5cbiAgbmdBZnRlclZpZXdJbml0KCkge1xuICAgIHRoaXMuc2V0UG9zaXRpb24oKTtcbiAgfVxuICBuZ09uQ2hhbmdlcygpIHtcbiAgICB0aGlzLnNldFBvc2l0aW9uKCk7XG4gIH1cblxuICBzZXRQb3NpdGlvbigpIHtcbiAgICBjb25zdCB3aW5kb3dTaXplID0ge1xuICAgICAgd2lkdGg6IHdpbmRvdy5pbm5lcldpZHRoLFxuICAgICAgaGVpZ2h0OiB3aW5kb3cuaW5uZXJIZWlnaHQsXG4gICAgfTtcblxuICAgIGlmICh0aGlzLmFuY2hvciA9PT0gbnVsbCB8fCB0aGlzLmNvbnRlbnQgPT09IG51bGwgfHwgdGhpcy5zY3JpbSA9PT0gbnVsbClcbiAgICAgIHJldHVybjtcblxuICAgIGNvbnN0IHNjcmltUmVjdCA9IHRoaXMuc2NyaW0ubmF0aXZlRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcblxuICAgIGNvbnN0IGFuY2hvclJlY3QgPVxuICAgICAgdGhpcy5hbmNob3IgaW5zdGFuY2VvZiBFbGVtZW50XG4gICAgICAgID8gdGhpcy5hbmNob3IuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KClcbiAgICAgICAgOiB0aGlzLmFuY2hvcjtcblxuICAgIGNvbnN0IGFuY2hvckJvdW5kcyA9IHtcbiAgICAgIHg6IGFuY2hvclJlY3QubGVmdCAtIHNjcmltUmVjdC5sZWZ0LCAvLyBJbiBtb3N0IGNhc2VzLCB0aGUgc2NyaW0gd2lsbCBiZSBwb3NpdGlvbmVkIGF0ICgwLDApLCBidXQgaWYgaXQncyBub3QsIHRoaXMgd2lsbCBtYWtlIHN1cmUgdGhlIGNhbGxvdXQgaXMgcG9zaXRpb25lZCBjb3JyZWN0bHkgcmVnYXJkbGVzcy5cbiAgICAgIHk6IGFuY2hvclJlY3QudG9wIC0gc2NyaW1SZWN0LnRvcCxcbiAgICAgIHdpZHRoOiBhbmNob3JSZWN0LnJpZ2h0IC0gYW5jaG9yUmVjdC5sZWZ0LFxuICAgICAgaGVpZ2h0OiBhbmNob3JSZWN0LmJvdHRvbSAtIGFuY2hvclJlY3QudG9wLFxuICAgIH07XG5cbiAgICBjb25zdCBjYWxsb3V0U2l6ZSA9IHtcbiAgICAgIHdpZHRoOiB0aGlzLmNvbnRlbnQubmF0aXZlRWxlbWVudC5jbGllbnRXaWR0aCxcbiAgICAgIGhlaWdodDogdGhpcy5jb250ZW50Lm5hdGl2ZUVsZW1lbnQuY2xpZW50SGVpZ2h0LFxuICAgIH07XG5cbiAgICBjb25zdCBjYWxsb3V0T3JpZ2luID0gZ2V0T3JpZ2luKFxuICAgICAgYW5jaG9yQm91bmRzLFxuICAgICAgY2FsbG91dFNpemUsXG4gICAgICB3aW5kb3dTaXplLFxuICAgICAgdGhpcy5wcmVmZXJyZWRQb3NpdGlvbixcbiAgICAgIHRoaXMuYWxsb3dlZFBvc2l0aW9ucyxcbiAgICAgIHRoaXMuZmFsbGJhY2tEaXJlY3Rpb24sXG4gICAgICB0aGlzLnNob3dDYXJldCA/IDggOiAwLFxuICAgICk7XG5cbiAgICB0aGlzLmxlZnQgPSBjYWxsb3V0T3JpZ2luLng7XG4gICAgdGhpcy50b3AgPSBjYWxsb3V0T3JpZ2luLnk7XG4gICAgdGhpcy5yZXNvbHZlZFBvc2l0aW9uID0gY2FsbG91dE9yaWdpbi5wb3NpdGlvbjtcbiAgICB0aGlzLmNkci5kZXRlY3RDaGFuZ2VzKCk7XG4gIH1cblxuICBAT3V0cHV0KClcbiAgcmVhZG9ubHkgY2xvc2UgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG59XG5cbmV4cG9ydCBuYW1lc3BhY2UgQ2FsbG91dENvbXBvbmVudCB7XG4gIGV4cG9ydCBjb25zdCBUaGVtZXMgPSBbJ2xpZ2h0JywgJ2RhcmsnXSBhcyBjb25zdDtcbiAgZXhwb3J0IHR5cGUgVGhlbWUgPSAodHlwZW9mIFRoZW1lcylbbnVtYmVyXTtcblxuICBleHBvcnQgY29uc3QgQW5jaG9yZWRQb3NpdGlvbnMgPSBbXG4gICAgJ3RvcC1sZWZ0JyxcbiAgICAndG9wLWNlbnRlcicsXG4gICAgJ3RvcC1yaWdodCcsXG4gICAgJ3JpZ2h0LXRvcCcsXG4gICAgJ2NlbnRlci1yaWdodCcsXG4gICAgJ3JpZ2h0LWJvdHRvbScsXG4gICAgJ2JvdHRvbS1yaWdodCcsXG4gICAgJ2JvdHRvbS1jZW50ZXInLFxuICAgICdib3R0b20tbGVmdCcsXG4gICAgJ2xlZnQtYm90dG9tJyxcbiAgICAnY2VudGVyLWxlZnQnLFxuICAgICdsZWZ0LXRvcCcsXG4gIF0gYXMgY29uc3Q7XG4gIGV4cG9ydCB0eXBlIEFuY2hvcmVkUG9zaXRpb24gPSAodHlwZW9mIEFuY2hvcmVkUG9zaXRpb25zKVtudW1iZXJdO1xuXG4gIGV4cG9ydCBjb25zdCBEaXJlY3Rpb25zID0gWydjbG9ja3dpc2UnLCAnY291bnRlci1jbG9ja3dpc2UnXSBhcyBjb25zdDtcbiAgZXhwb3J0IHR5cGUgRGlyZWN0aW9uID0gKHR5cGVvZiBEaXJlY3Rpb25zKVtudW1iZXJdO1xufVxuIiwiPGRpdiAjc2NyaW0gY2xhc3M9XCJzY3JpbVwiIFtjbGFzcy5mdWxsXT1cImlzTW9kYWxcIiAoY2xpY2spPVwic2NyaW1DbGljaygkZXZlbnQpXCI+XG4gIDxkaXZcbiAgICBjbGFzcz1cImNhbGxvdXRcIlxuICAgIFtuZ0NsYXNzXT1cIlt0aGVtZSwgcmVzb2x2ZWRQb3NpdGlvbl1cIlxuICAgIFtjbGFzcy5jYXJldF09XCJzaG93Q2FyZXRcIlxuICAgIFtzdHlsZS5sZWZ0LnB4XT1cImxlZnRcIlxuICAgIFtzdHlsZS50b3AucHhdPVwidG9wXCJcbiAgICBbcml2TG9ja1Njcm9sbF09XCJpc01vZGFsXCJcbiAgICAjY29udGVudFxuICA+XG4gICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICA8L2Rpdj5cbjwvZGl2PlxuIl19
|
|
118
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FsbG91dC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9yaXYvc3JjL2xpYi9vdmVybGF5L2NhbGxvdXQvY2FsbG91dC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9yaXYvc3JjL2xpYi9vdmVybGF5L2NhbGxvdXQvY2FsbG91dC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBRUwsdUJBQXVCLEVBRXZCLFNBQVMsRUFFVCxZQUFZLEVBQ1osS0FBSyxFQUVMLE1BQU0sRUFDTixTQUFTLEdBQ1YsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLG1CQUFtQixDQUFDOzs7O0FBRTlDLDZFQUE2RTtBQUM3RSxzQ0FBc0M7QUFDdEMsbUdBQW1HO0FBT25HLE1BQU0sT0FBTyxnQkFBZ0I7SUFDM0IsWUFBNkIsR0FBc0I7UUFBdEIsUUFBRyxHQUFILEdBQUcsQ0FBbUI7UUFHbkQsV0FBTSxHQUE2QixJQUFJLENBQUM7UUFHeEMsWUFBTyxHQUFZLElBQUksQ0FBQztRQUd4QixzQkFBaUIsR0FBc0MsY0FBYyxDQUFDO1FBR3RFLHFCQUFnQixHQUF3QztZQUN0RCxHQUFHLGdCQUFnQixDQUFDLGlCQUFpQjtTQUN0QyxDQUFDO1FBR0Ysc0JBQWlCLEdBQStCLG1CQUFtQixDQUFDO1FBR3BFLGNBQVMsR0FBWSxJQUFJLENBQUM7UUFHMUIsVUFBSyxHQUEyQixNQUFNLENBQUM7UUFHdkMsWUFBTyxHQUFzQyxJQUFJLENBQUM7UUFHbEQsVUFBSyxHQUFtQyxJQUFJLENBQUM7UUFFckMsNEJBQXVCLEdBQUcsS0FBSyxDQUFDO1FBWXhDLFNBQUksR0FBVyxDQUFDLENBQUM7UUFDakIsUUFBRyxHQUFXLENBQUMsQ0FBQztRQUNoQixxQkFBZ0IsR0FBc0MsSUFBSSxDQUFDLGlCQUFpQixDQUFDO1FB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O2dCQU1OLGlCQUFpQjtzQkFEaEIsS0FBSztnQkFJTixTQUFTO3NCQURSLEtBQUs7Z0JBSU4sS0FBSztzQkFESixLQUFLO2dCQUlOLE9BQU87c0JBRE4sU0FBUzt1QkFBQyxTQUFTO2dCQUlwQixLQUFLO3NCQURKLFNBQVM7dUJBQUMsT0FBTyxFQUFFLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRTtnQkF1RTVCLEtBQUs7c0JBRGIsTUFBTTs7QUFJVCxXQUFpQixnQkFBZ0I7SUFDbEIsdUJBQU0sR0FBRyxDQUFDLE9BQU8sRUFBRSxNQUFNLENBQVUsQ0FBQztJQUdwQyxrQ0FBaUIsR0FBRztRQUMvQixVQUFVO1FBQ1YsWUFBWTtRQUNaLFdBQVc7UUFDWCxXQUFXO1FBQ1gsY0FBYztRQUNkLGNBQWM7UUFDZCxjQUFjO1FBQ2QsZUFBZTtRQUNmLGFBQWE7UUFDYixhQUFhO1FBQ2IsYUFBYTtRQUNiLFVBQVU7S0FDRixDQUFDO0lBR0UsMkJBQVUsR0FBRyxDQUFDLFdBQVcsRUFBRSxtQkFBbUIsQ0FBVSxDQUFDO0FBRXhFLENBQUMsRUF0QmdCLGdCQUFnQixLQUFoQixnQkFBZ0IsUUFzQmhDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQWZ0ZXJWaWV3SW5pdCxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENoYW5nZURldGVjdG9yUmVmLFxuICBDb21wb25lbnQsXG4gIEVsZW1lbnRSZWYsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE9uQ2hhbmdlcyxcbiAgT3V0cHV0LFxuICBWaWV3Q2hpbGQsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgZ2V0T3JpZ2luIH0gZnJvbSAnLi9jYWxsb3V0LmhlbHBlcnMnO1xuXG4vLyBUT0RPOiBvbmNlIHdlIHVwZ3JhZGUgdG8gQW5ndWxhciAxNiwgdGhpcyBjb21wb25lbnQgY2FuIGJlIGNsZWFuZWQgdXAgd2l0aFxuLy8gc2lnbmFscyBpbnN0ZWFkIG9mIGxpZmVjeWNsZSBob29rcy5cbi8vIGh0dHBzOi8vd3d3Lm5vdGlvbi5zby9yaXZldC9SZXNvbHZlLVRPRE9zLWFmdGVyLUFuZ3VsYXItdXBncmFkZS0xZjI2NjdlYjJhMzE4MGI3OWY2YWQ5MmE3ZTU3NmYwOFxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAncml2LWNhbGxvdXQnLFxuICB0ZW1wbGF0ZVVybDogJy4vY2FsbG91dC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2NhbGxvdXQuY29tcG9uZW50LmNzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgQ2FsbG91dENvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQsIE9uQ2hhbmdlcyB7XG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgcmVhZG9ubHkgY2RyOiBDaGFuZ2VEZXRlY3RvclJlZikge31cblxuICBASW5wdXQoKVxuICBhbmNob3I6IEVsZW1lbnQgfCBET01SZWN0IHwgbnVsbCA9IG51bGw7XG5cbiAgQElucHV0KClcbiAgaXNNb2RhbDogYm9vbGVhbiA9IHRydWU7XG5cbiAgQElucHV0KClcbiAgcHJlZmVycmVkUG9zaXRpb246IENhbGxvdXRDb21wb25lbnQuQW5jaG9yZWRQb3NpdGlvbiA9ICdib3R0b20tcmlnaHQnO1xuXG4gIEBJbnB1dCgpXG4gIGFsbG93ZWRQb3NpdGlvbnM6IENhbGxvdXRDb21wb25lbnQuQW5jaG9yZWRQb3NpdGlvbltdID0gW1xuICAgIC4uLkNhbGxvdXRDb21wb25lbnQuQW5jaG9yZWRQb3NpdGlvbnMsXG4gIF07XG5cbiAgQElucHV0KClcbiAgZmFsbGJhY2tEaXJlY3Rpb246IENhbGxvdXRDb21wb25lbnQuRGlyZWN0aW9uID0gJ2NvdW50ZXItY2xvY2t3aXNlJztcblxuICBASW5wdXQoKVxuICBzaG93Q2FyZXQ6IGJvb2xlYW4gPSB0cnVlO1xuXG4gIEBJbnB1dCgpXG4gIHRoZW1lOiBDYWxsb3V0Q29tcG9uZW50LlRoZW1lID0gJ2RhcmsnO1xuXG4gIEBWaWV3Q2hpbGQoJ2NvbnRlbnQnKVxuICBjb250ZW50OiBFbGVtZW50UmVmPEhUTUxEaXZFbGVtZW50PiB8IG51bGwgPSBudWxsO1xuXG4gIEBWaWV3Q2hpbGQoJ3NjcmltJywgeyBzdGF0aWM6IGZhbHNlIH0pXG4gIHNjcmltOiBFbGVtZW50UmVmPEhUTUxFbGVtZW50PiB8IG51bGwgPSBudWxsO1xuXG4gIHByaXZhdGUgbW91c2VEb3duU3RhcnRlZEluU2NyaW0gPSBmYWxzZTtcbiAgb25TY3JpbU1vdXNlRG93bihldnQ6IE1vdXNlRXZlbnQgfCBUb3VjaEV2ZW50KSB7XG4gICAgdGhpcy5tb3VzZURvd25TdGFydGVkSW5TY3JpbSA9IGV2dC50YXJnZXQgPT09IGV2dC5jdXJyZW50VGFyZ2V0O1xuICB9XG5cbiAgb25TY3JpbU1vdXNlVXAoZXZ0OiBNb3VzZUV2ZW50IHwgVG91Y2hFdmVudCkge1xuICAgIGlmICh0aGlzLm1vdXNlRG93blN0YXJ0ZWRJblNjcmltICYmIGV2dC50YXJnZXQgPT09IGV2dC5jdXJyZW50VGFyZ2V0KSB7XG4gICAgICB0aGlzLmNsb3NlLmVtaXQoKTtcbiAgICB9XG4gICAgdGhpcy5tb3VzZURvd25TdGFydGVkSW5TY3JpbSA9IGZhbHNlO1xuICB9XG5cbiAgbGVmdDogbnVtYmVyID0gMDtcbiAgdG9wOiBudW1iZXIgPSAwO1xuICByZXNvbHZlZFBvc2l0aW9uOiBDYWxsb3V0Q29tcG9uZW50LkFuY2hvcmVkUG9zaXRpb24gPSB0aGlzLnByZWZlcnJlZFBvc2l0aW9uO1xuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICB0aGlzLnNldFBvc2l0aW9uKCk7XG4gIH1cbiAgbmdPbkNoYW5nZXMoKSB7XG4gICAgdGhpcy5zZXRQb3NpdGlvbigpO1xuICB9XG5cbiAgc2V0UG9zaXRpb24oKSB7XG4gICAgY29uc3Qgd2luZG93U2l6ZSA9IHtcbiAgICAgIHdpZHRoOiB3aW5kb3cuaW5uZXJXaWR0aCxcbiAgICAgIGhlaWdodDogd2luZG93LmlubmVySGVpZ2h0LFxuICAgIH07XG5cbiAgICBpZiAodGhpcy5hbmNob3IgPT09IG51bGwgfHwgdGhpcy5jb250ZW50ID09PSBudWxsIHx8IHRoaXMuc2NyaW0gPT09IG51bGwpXG4gICAgICByZXR1cm47XG5cbiAgICBjb25zdCBzY3JpbVJlY3QgPSB0aGlzLnNjcmltLm5hdGl2ZUVsZW1lbnQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCk7XG5cbiAgICBjb25zdCBhbmNob3JSZWN0ID1cbiAgICAgIHRoaXMuYW5jaG9yIGluc3RhbmNlb2YgRWxlbWVudFxuICAgICAgICA/IHRoaXMuYW5jaG9yLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpXG4gICAgICAgIDogdGhpcy5hbmNob3I7XG5cbiAgICBjb25zdCBhbmNob3JCb3VuZHMgPSB7XG4gICAgICB4OiBhbmNob3JSZWN0LmxlZnQgLSBzY3JpbVJlY3QubGVmdCwgLy8gSW4gbW9zdCBjYXNlcywgdGhlIHNjcmltIHdpbGwgYmUgcG9zaXRpb25lZCBhdCAoMCwwKSwgYnV0IGlmIGl0J3Mgbm90LCB0aGlzIHdpbGwgbWFrZSBzdXJlIHRoZSBjYWxsb3V0IGlzIHBvc2l0aW9uZWQgY29ycmVjdGx5IHJlZ2FyZGxlc3MuXG4gICAgICB5OiBhbmNob3JSZWN0LnRvcCAtIHNjcmltUmVjdC50b3AsXG4gICAgICB3aWR0aDogYW5jaG9yUmVjdC5yaWdodCAtIGFuY2hvclJlY3QubGVmdCxcbiAgICAgIGhlaWdodDogYW5jaG9yUmVjdC5ib3R0b20gLSBhbmNob3JSZWN0LnRvcCxcbiAgICB9O1xuXG4gICAgY29uc3QgY2FsbG91dFNpemUgPSB7XG4gICAgICB3aWR0aDogdGhpcy5jb250ZW50Lm5hdGl2ZUVsZW1lbnQuY2xpZW50V2lkdGgsXG4gICAgICBoZWlnaHQ6IHRoaXMuY29udGVudC5uYXRpdmVFbGVtZW50LmNsaWVudEhlaWdodCxcbiAgICB9O1xuXG4gICAgY29uc3QgY2FsbG91dE9yaWdpbiA9IGdldE9yaWdpbihcbiAgICAgIGFuY2hvckJvdW5kcyxcbiAgICAgIGNhbGxvdXRTaXplLFxuICAgICAgd2luZG93U2l6ZSxcbiAgICAgIHRoaXMucHJlZmVycmVkUG9zaXRpb24sXG4gICAgICB0aGlzLmFsbG93ZWRQb3NpdGlvbnMsXG4gICAgICB0aGlzLmZhbGxiYWNrRGlyZWN0aW9uLFxuICAgICAgdGhpcy5zaG93Q2FyZXQgPyA4IDogMCxcbiAgICApO1xuXG4gICAgdGhpcy5sZWZ0ID0gY2FsbG91dE9yaWdpbi54O1xuICAgIHRoaXMudG9wID0gY2FsbG91dE9yaWdpbi55O1xuICAgIHRoaXMucmVzb2x2ZWRQb3NpdGlvbiA9IGNhbGxvdXRPcmlnaW4ucG9zaXRpb247XG4gICAgdGhpcy5jZHIuZGV0ZWN0Q2hhbmdlcygpO1xuICB9XG5cbiAgQE91dHB1dCgpXG4gIHJlYWRvbmx5IGNsb3NlID0gbmV3IEV2ZW50RW1pdHRlcigpO1xufVxuXG5leHBvcnQgbmFtZXNwYWNlIENhbGxvdXRDb21wb25lbnQge1xuICBleHBvcnQgY29uc3QgVGhlbWVzID0gWydsaWdodCcsICdkYXJrJ10gYXMgY29uc3Q7XG4gIGV4cG9ydCB0eXBlIFRoZW1lID0gKHR5cGVvZiBUaGVtZXMpW251bWJlcl07XG5cbiAgZXhwb3J0IGNvbnN0IEFuY2hvcmVkUG9zaXRpb25zID0gW1xuICAgICd0b3AtbGVmdCcsXG4gICAgJ3RvcC1jZW50ZXInLFxuICAgICd0b3AtcmlnaHQnLFxuICAgICdyaWdodC10b3AnLFxuICAgICdjZW50ZXItcmlnaHQnLFxuICAgICdyaWdodC1ib3R0b20nLFxuICAgICdib3R0b20tcmlnaHQnLFxuICAgICdib3R0b20tY2VudGVyJyxcbiAgICAnYm90dG9tLWxlZnQnLFxuICAgICdsZWZ0LWJvdHRvbScsXG4gICAgJ2NlbnRlci1sZWZ0JyxcbiAgICAnbGVmdC10b3AnLFxuICBdIGFzIGNvbnN0O1xuICBleHBvcnQgdHlwZSBBbmNob3JlZFBvc2l0aW9uID0gKHR5cGVvZiBBbmNob3JlZFBvc2l0aW9ucylbbnVtYmVyXTtcblxuICBleHBvcnQgY29uc3QgRGlyZWN0aW9ucyA9IFsnY2xvY2t3aXNlJywgJ2NvdW50ZXItY2xvY2t3aXNlJ10gYXMgY29uc3Q7XG4gIGV4cG9ydCB0eXBlIERpcmVjdGlvbiA9ICh0eXBlb2YgRGlyZWN0aW9ucylbbnVtYmVyXTtcbn1cbiIsIjxkaXZcbiAgI3NjcmltXG4gIGNsYXNzPVwic2NyaW1cIlxuICBbY2xhc3MuZnVsbF09XCJpc01vZGFsXCJcbiAgKG1vdXNlZG93bik9XCJvblNjcmltTW91c2VEb3duKCRldmVudClcIlxuICAobW91c2V1cCk9XCJvblNjcmltTW91c2VVcCgkZXZlbnQpXCJcbiAgKHRvdWNoc3RhcnQpPVwib25TY3JpbU1vdXNlRG93bigkZXZlbnQpXCJcbiAgKHRvdWNoZW5kKT1cIm9uU2NyaW1Nb3VzZVVwKCRldmVudClcIlxuPlxuICA8ZGl2XG4gICAgY2xhc3M9XCJjYWxsb3V0XCJcbiAgICBbbmdDbGFzc109XCJbdGhlbWUsIHJlc29sdmVkUG9zaXRpb25dXCJcbiAgICBbY2xhc3MuY2FyZXRdPVwic2hvd0NhcmV0XCJcbiAgICBbc3R5bGUubGVmdC5weF09XCJsZWZ0XCJcbiAgICBbc3R5bGUudG9wLnB4XT1cInRvcFwiXG4gICAgW3JpdkxvY2tTY3JvbGxdPVwiaXNNb2RhbFwiXG4gICAgI2NvbnRlbnRcbiAgPlxuICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -6,21 +6,26 @@ export class ModalComponent {
|
|
|
6
6
|
constructor() {
|
|
7
7
|
this.obscure = false;
|
|
8
8
|
this.close = new EventEmitter();
|
|
9
|
+
this.mouseDownStartedInScrim = false;
|
|
9
10
|
}
|
|
10
|
-
|
|
11
|
-
|
|
11
|
+
onScrimMouseDown(evt) {
|
|
12
|
+
this.mouseDownStartedInScrim = evt.target === evt.currentTarget;
|
|
13
|
+
}
|
|
14
|
+
onScrimMouseUp(evt) {
|
|
15
|
+
if (this.mouseDownStartedInScrim && evt.target === evt.currentTarget) {
|
|
12
16
|
this.close.emit();
|
|
13
17
|
}
|
|
18
|
+
this.mouseDownStartedInScrim = false;
|
|
14
19
|
}
|
|
15
20
|
}
|
|
16
21
|
ModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
17
|
-
ModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ModalComponent, selector: "riv-modal", inputs: { obscure: "obscure" }, outputs: { close: "close" }, ngImport: i0, template: "<div\n #scrim\n *riv-overlay\n [rivLockScroll]=\"true\"\n class=\"scrim\"\n [class.obscure]=\"obscure\"\n (
|
|
22
|
+
ModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ModalComponent, selector: "riv-modal", inputs: { obscure: "obscure" }, outputs: { close: "close" }, ngImport: i0, template: "<div\n #scrim\n *riv-overlay\n [rivLockScroll]=\"true\"\n class=\"scrim\"\n [class.obscure]=\"obscure\"\n (mousedown)=\"onScrimMouseDown($event)\"\n (mouseup)=\"onScrimMouseUp($event)\"\n (touchstart)=\"onScrimMouseDown($event)\"\n (touchend)=\"onScrimMouseUp($event)\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [".scrim{position:fixed;z-index:var(--callout-z-index);cursor:default;inset:0}.scrim.obscure{background-color:var(--modal-scrim)}\n"], dependencies: [{ kind: "directive", type: i1.LockScrollDirective, selector: "[rivLockScroll]", inputs: ["rivLockScroll"] }, { kind: "directive", type: i2.OverlayDirective, selector: "[riv-overlay]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
18
23
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ModalComponent, decorators: [{
|
|
19
24
|
type: Component,
|
|
20
|
-
args: [{ selector: 'riv-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n #scrim\n *riv-overlay\n [rivLockScroll]=\"true\"\n class=\"scrim\"\n [class.obscure]=\"obscure\"\n (
|
|
25
|
+
args: [{ selector: 'riv-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n #scrim\n *riv-overlay\n [rivLockScroll]=\"true\"\n class=\"scrim\"\n [class.obscure]=\"obscure\"\n (mousedown)=\"onScrimMouseDown($event)\"\n (mouseup)=\"onScrimMouseUp($event)\"\n (touchstart)=\"onScrimMouseDown($event)\"\n (touchend)=\"onScrimMouseUp($event)\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [".scrim{position:fixed;z-index:var(--callout-z-index);cursor:default;inset:0}.scrim.obscure{background-color:var(--modal-scrim)}\n"] }]
|
|
21
26
|
}], propDecorators: { obscure: [{
|
|
22
27
|
type: Input
|
|
23
28
|
}], close: [{
|
|
24
29
|
type: Output
|
|
25
30
|
}] } });
|
|
26
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
31
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9kYWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvcml2L3NyYy9saWIvb3ZlcmxheS9tb2RhbC9tb2RhbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9yaXYvc3JjL2xpYi9vdmVybGF5L21vZGFsL21vZGFsLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixLQUFLLEVBQ0wsTUFBTSxHQUNQLE1BQU0sZUFBZSxDQUFDOzs7O0FBUXZCLE1BQU0sT0FBTyxjQUFjO0lBTjNCO1FBUUUsWUFBTyxHQUFZLEtBQUssQ0FBQztRQUdoQixVQUFLLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUU1Qiw0QkFBdUIsR0FBRyxLQUFLLENBQUM7S0FXekM7SUFWQyxnQkFBZ0IsQ0FBQyxHQUE0QjtRQUMzQyxJQUFJLENBQUMsdUJBQXVCLEdBQUcsR0FBRyxDQUFDLE1BQU0sS0FBSyxHQUFHLENBQUMsYUFBYSxDQUFDO0lBQ2xFLENBQUM7SUFFRCxjQUFjLENBQUMsR0FBNEI7UUFDekMsSUFBSSxJQUFJLENBQUMsdUJBQXVCLElBQUksR0FBRyxDQUFDLE1BQU0sS0FBSyxHQUFHLENBQUMsYUFBYSxFQUFFO1lBQ3BFLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxFQUFFLENBQUM7U0FDbkI7UUFDRCxJQUFJLENBQUMsdUJBQXVCLEdBQUcsS0FBSyxDQUFDO0lBQ3ZDLENBQUM7OzJHQWpCVSxjQUFjOytGQUFkLGNBQWMsOEdDZDNCLGtVQWFBOzJGRENhLGNBQWM7a0JBTjFCLFNBQVM7K0JBQ0UsV0FBVyxtQkFHSix1QkFBdUIsQ0FBQyxNQUFNOzhCQUkvQyxPQUFPO3NCQUROLEtBQUs7Z0JBSUcsS0FBSztzQkFEYixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENvbXBvbmVudCxcbiAgRXZlbnRFbWl0dGVyLFxuICBJbnB1dCxcbiAgT3V0cHV0LFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAncml2LW1vZGFsJyxcbiAgdGVtcGxhdGVVcmw6ICcuL21vZGFsLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vbW9kYWwuY29tcG9uZW50LmNzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgTW9kYWxDb21wb25lbnQge1xuICBASW5wdXQoKVxuICBvYnNjdXJlOiBib29sZWFuID0gZmFsc2U7XG5cbiAgQE91dHB1dCgpXG4gIHJlYWRvbmx5IGNsb3NlID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG4gIHByaXZhdGUgbW91c2VEb3duU3RhcnRlZEluU2NyaW0gPSBmYWxzZTtcbiAgb25TY3JpbU1vdXNlRG93bihldnQ6IE1vdXNlRXZlbnQgfCBUb3VjaEV2ZW50KSB7XG4gICAgdGhpcy5tb3VzZURvd25TdGFydGVkSW5TY3JpbSA9IGV2dC50YXJnZXQgPT09IGV2dC5jdXJyZW50VGFyZ2V0O1xuICB9XG5cbiAgb25TY3JpbU1vdXNlVXAoZXZ0OiBNb3VzZUV2ZW50IHwgVG91Y2hFdmVudCkge1xuICAgIGlmICh0aGlzLm1vdXNlRG93blN0YXJ0ZWRJblNjcmltICYmIGV2dC50YXJnZXQgPT09IGV2dC5jdXJyZW50VGFyZ2V0KSB7XG4gICAgICB0aGlzLmNsb3NlLmVtaXQoKTtcbiAgICB9XG4gICAgdGhpcy5tb3VzZURvd25TdGFydGVkSW5TY3JpbSA9IGZhbHNlO1xuICB9XG59XG4iLCI8ZGl2XG4gICNzY3JpbVxuICAqcml2LW92ZXJsYXlcbiAgW3JpdkxvY2tTY3JvbGxdPVwidHJ1ZVwiXG4gIGNsYXNzPVwic2NyaW1cIlxuICBbY2xhc3Mub2JzY3VyZV09XCJvYnNjdXJlXCJcbiAgKG1vdXNlZG93bik9XCJvblNjcmltTW91c2VEb3duKCRldmVudClcIlxuICAobW91c2V1cCk9XCJvblNjcmltTW91c2VVcCgkZXZlbnQpXCJcbiAgKHRvdWNoc3RhcnQpPVwib25TY3JpbU1vdXNlRG93bigkZXZlbnQpXCJcbiAgKHRvdWNoZW5kKT1cIm9uU2NyaW1Nb3VzZVVwKCRldmVudClcIlxuPlxuICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -750,15 +750,20 @@ class CalloutComponent {
|
|
|
750
750
|
this.theme = 'dark';
|
|
751
751
|
this.content = null;
|
|
752
752
|
this.scrim = null;
|
|
753
|
+
this.mouseDownStartedInScrim = false;
|
|
753
754
|
this.left = 0;
|
|
754
755
|
this.top = 0;
|
|
755
756
|
this.resolvedPosition = this.preferredPosition;
|
|
756
757
|
this.close = new EventEmitter();
|
|
757
758
|
}
|
|
758
|
-
|
|
759
|
-
|
|
759
|
+
onScrimMouseDown(evt) {
|
|
760
|
+
this.mouseDownStartedInScrim = evt.target === evt.currentTarget;
|
|
761
|
+
}
|
|
762
|
+
onScrimMouseUp(evt) {
|
|
763
|
+
if (this.mouseDownStartedInScrim && evt.target === evt.currentTarget) {
|
|
760
764
|
this.close.emit();
|
|
761
765
|
}
|
|
766
|
+
this.mouseDownStartedInScrim = false;
|
|
762
767
|
}
|
|
763
768
|
ngAfterViewInit() {
|
|
764
769
|
this.setPosition();
|
|
@@ -795,10 +800,10 @@ class CalloutComponent {
|
|
|
795
800
|
}
|
|
796
801
|
}
|
|
797
802
|
CalloutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalloutComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
798
|
-
CalloutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CalloutComponent, selector: "riv-callout", inputs: { anchor: "anchor", isModal: "isModal", preferredPosition: "preferredPosition", allowedPositions: "allowedPositions", fallbackDirection: "fallbackDirection", showCaret: "showCaret", theme: "theme" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }, { propertyName: "scrim", first: true, predicate: ["scrim"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div
|
|
803
|
+
CalloutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CalloutComponent, selector: "riv-callout", inputs: { anchor: "anchor", isModal: "isModal", preferredPosition: "preferredPosition", allowedPositions: "allowedPositions", fallbackDirection: "fallbackDirection", showCaret: "showCaret", theme: "theme" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }, { propertyName: "scrim", first: true, predicate: ["scrim"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n #scrim\n class=\"scrim\"\n [class.full]=\"isModal\"\n (mousedown)=\"onScrimMouseDown($event)\"\n (mouseup)=\"onScrimMouseUp($event)\"\n (touchstart)=\"onScrimMouseDown($event)\"\n (touchend)=\"onScrimMouseUp($event)\"\n>\n <div\n class=\"callout\"\n [ngClass]=\"[theme, resolvedPosition]\"\n [class.caret]=\"showCaret\"\n [style.left.px]=\"left\"\n [style.top.px]=\"top\"\n [rivLockScroll]=\"isModal\"\n #content\n >\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".scrim{position:fixed;z-index:var(--callout-z-index);cursor:default;top:0;right:0;left:0}.scrim.full{bottom:0}.callout{position:absolute;background-color:var(--background-color);border:var(--border-width) solid var(--border-color);border-radius:var(--border-radius-medium);color:var(--text-color);box-shadow:var(--depth-2)}.callout.dark{--background-color: var(--surface-dark-0);--border-color: var(--border-dark);--text-color: var(--type-dark-high-contrast)}.callout.light{--background-color: var(--surface-light-0);--border-color: var(--border-light);--text-color: var(--type-light-high-contrast)}.callout.caret:after{--size: 11px;content:\"\";width:var(--size);height:var(--size);position:absolute;background-color:var(--background-color);border-left:var(--border-width) solid var(--border-color);border-bottom:var(--border-width) solid var(--border-color)}.callout.caret.top-left:after{right:var(--size-large);bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.top-center:after{left:50%;bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.top-right:after{left:var(--size-large);bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.right-top:after{top:var(--size-large);left:0;transform:translate(-50%,-50%) rotate(45deg)}.callout.caret.center-right:after{top:50%;left:0;transform:translate(-50%,-50%) rotate(45deg)}.callout.caret.right-bottom:after{left:0;bottom:var(--size-large);transform:translate(-50%,50%) rotate(45deg)}.callout.caret.bottom-right:after{top:0;left:var(--size-large);transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.bottom-center:after{top:0;left:50%;transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.bottom-left:after{top:0;right:var(--size-large);transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.left-bottom:after{right:0;bottom:var(--size-large);transform:translate(50%,50%) rotate(225deg)}.callout.caret.center-left:after{top:50%;right:0;transform:translate(50%,-50%) rotate(225deg)}.callout.caret.left-top:after{top:var(--size-large);right:0;transform:translate(50%,-50%) rotate(225deg)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: LockScrollDirective, selector: "[rivLockScroll]", inputs: ["rivLockScroll"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
799
804
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalloutComponent, decorators: [{
|
|
800
805
|
type: Component,
|
|
801
|
-
args: [{ selector: 'riv-callout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div
|
|
806
|
+
args: [{ selector: 'riv-callout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n #scrim\n class=\"scrim\"\n [class.full]=\"isModal\"\n (mousedown)=\"onScrimMouseDown($event)\"\n (mouseup)=\"onScrimMouseUp($event)\"\n (touchstart)=\"onScrimMouseDown($event)\"\n (touchend)=\"onScrimMouseUp($event)\"\n>\n <div\n class=\"callout\"\n [ngClass]=\"[theme, resolvedPosition]\"\n [class.caret]=\"showCaret\"\n [style.left.px]=\"left\"\n [style.top.px]=\"top\"\n [rivLockScroll]=\"isModal\"\n #content\n >\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".scrim{position:fixed;z-index:var(--callout-z-index);cursor:default;top:0;right:0;left:0}.scrim.full{bottom:0}.callout{position:absolute;background-color:var(--background-color);border:var(--border-width) solid var(--border-color);border-radius:var(--border-radius-medium);color:var(--text-color);box-shadow:var(--depth-2)}.callout.dark{--background-color: var(--surface-dark-0);--border-color: var(--border-dark);--text-color: var(--type-dark-high-contrast)}.callout.light{--background-color: var(--surface-light-0);--border-color: var(--border-light);--text-color: var(--type-light-high-contrast)}.callout.caret:after{--size: 11px;content:\"\";width:var(--size);height:var(--size);position:absolute;background-color:var(--background-color);border-left:var(--border-width) solid var(--border-color);border-bottom:var(--border-width) solid var(--border-color)}.callout.caret.top-left:after{right:var(--size-large);bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.top-center:after{left:50%;bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.top-right:after{left:var(--size-large);bottom:0;transform:translate(-50%,50%) rotate(315deg)}.callout.caret.right-top:after{top:var(--size-large);left:0;transform:translate(-50%,-50%) rotate(45deg)}.callout.caret.center-right:after{top:50%;left:0;transform:translate(-50%,-50%) rotate(45deg)}.callout.caret.right-bottom:after{left:0;bottom:var(--size-large);transform:translate(-50%,50%) rotate(45deg)}.callout.caret.bottom-right:after{top:0;left:var(--size-large);transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.bottom-center:after{top:0;left:50%;transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.bottom-left:after{top:0;right:var(--size-large);transform:translate(-50%,-50%) rotate(135deg)}.callout.caret.left-bottom:after{right:0;bottom:var(--size-large);transform:translate(50%,50%) rotate(225deg)}.callout.caret.center-left:after{top:50%;right:0;transform:translate(50%,-50%) rotate(225deg)}.callout.caret.left-top:after{top:var(--size-large);right:0;transform:translate(50%,-50%) rotate(225deg)}\n"] }]
|
|
802
807
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { anchor: [{
|
|
803
808
|
type: Input
|
|
804
809
|
}], isModal: [{
|
|
@@ -2944,10 +2949,10 @@ class SelectComponent extends InputLabelComponent {
|
|
|
2944
2949
|
}
|
|
2945
2950
|
}
|
|
2946
2951
|
SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2947
|
-
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectComponent, selector: "riv-select", inputs: { manager: "manager", disabled: "disabled", locked: "locked" }, queries: [{ propertyName: "triggerTemplate", first: true, predicate: ["trigger"], descendants: true }, { propertyName: "optionTemplate", first: true, predicate: ["option"], descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true }, { propertyName: "footerTemplate", first: true, predicate: ["footer"], descendants: true }], viewQueries: [{ propertyName: "customTriggerButton", first: true, predicate: ["customTriggerButton"], descendants: true }, { propertyName: "standardTriggerButton", first: true, predicate: ["standardTriggerButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"manager?.state | async; let s\">\n <ng-template #content>\n <riv-loading-cover [loading]=\"s.load.loading\">\n <div class=\"content-body\" [class.inline]=\"s.display.inline\">\n <header *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"headerTemplate; context: { state: s }\"\n ></ng-container>\n </header>\n <riv-search\n *ngIf=\"s.query.allowSearch\"\n [value]=\"s.query.search\"\n (valueChange)=\"\n manager?.actions?.next({ type: 'searchChange', payload: $event })\n \"\n ></riv-search>\n <div class=\"options\">\n <riv-select-node\n *ngIf=\"\n s.selection.allowMultiSelect &&\n s.selection.allowSelectAll &&\n !s.display.zeroStateMessage\n \"\n [mode]=\"'multi'\"\n [node]=\"{\n id: '__NOOP__',\n title: s.query.search ? 'Select all matching' : 'Select all',\n selected: s.selection.visibleSelectionState,\n selectable: true,\n expandable: false,\n expanded: false\n }\"\n (selectChange)=\"\n manager?.actions?.next({ type: 'visibleSelectedChange' })\n \"\n ></riv-select-node>\n <div\n *ngFor=\"let group of s.fullOptionGroups\"\n class=\"group\"\n [class.divider]=\"s.display.dividers\"\n >\n <span *ngIf=\"group.header; let header\" class=\"header\">\n {{ header }}\n </span>\n <ng-container *ngFor=\"let option of group.options\">\n <ng-container *ngIf=\"optionTemplate; else standardTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ node: option }\"\n ></ng-container>\n </ng-container>\n <ng-template #standardTemplate>\n <riv-select-node\n [mode]=\"s.selection.allowMultiSelect ? 'multi' : 'single'\"\n [node]=\"option\"\n [showSingleSelected]=\"s.display.showSingleSelected\"\n (selectChange)=\"\n selectChange(s.selection.allowMultiSelect, $event)\n \"\n (expandChange)=\"\n manager?.actions?.next({\n type: 'toggleOptionExpanded',\n id: $event\n })\n \"\n ></riv-select-node>\n </ng-template>\n </ng-container>\n </div>\n <span\n *ngIf=\"s.display.displayLimitMessage; let message\"\n class=\"display-limit\"\n >\n {{ message }}\n </span>\n <riv-zero-state\n *ngIf=\"s.display.zeroStateMessage; let message\"\n [message]=\"message\"\n ></riv-zero-state>\n </div>\n <footer *ngIf=\"footerTemplate\" class=\"custom-footer\">\n <ng-container\n *ngTemplateOutlet=\"footerTemplate; context: { state: s }\"\n ></ng-container>\n </footer>\n </div>\n </riv-loading-cover>\n </ng-template>\n\n <ng-container *ngIf=\"!s.display.inline; else content\">\n <ng-container *ngIf=\"triggerTemplate; else standardTrigger\">\n <button\n #customTriggerButton\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n [ngTemplateOutlet]=\"triggerTemplate\"\n [ngTemplateOutletContext]=\"{ state: s }\"\n ></ng-container>\n </button>\n </ng-container>\n <ng-template #standardTrigger>\n <riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n >\n <button\n #standardTriggerButton\n class=\"trigger\"\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n *ngIf=\"s.selection.selected.size; else placeholderValue\"\n >\n <span *ngIf=\"s.selection.selected.size > 1\" class=\"selected-count\">\n {{ s.selection.selected.size | rivNumber }}\n </span>\n <span class=\"value\">{{ s.display.selected }}</span>\n </ng-container>\n <ng-template #placeholderValue>\n <span class=\"value placeholder\">{{ s.display.placeholder }}</span>\n </ng-template>\n <span class=\"chevron\">\n <riv-icon\n *ngIf=\"!locked\"\n [name]=\"'ChevronDown'\"\n [size]=\"16\"\n ></riv-icon>\n <riv-icon *ngIf=\"locked\" [name]=\"'Lock'\" [size]=\"16\"></riv-icon>\n </span>\n </button>\n </riv-input-label>\n </ng-template>\n\n <ng-container *ngIf=\"s.display.open\">\n <riv-callout\n *riv-overlay\n [anchor]=\"getTrigger()\"\n [theme]=\"'light'\"\n [showCaret]=\"false\"\n [allowedPositions]=\"[\n 'top-left',\n 'top-center',\n 'top-right',\n 'bottom-right',\n 'bottom-center',\n 'bottom-left'\n ]\"\n (close)=\"manager?.actions?.next({ type: 'openChange', open: false })\"\n >\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n </riv-callout>\n </ng-container>\n </ng-container>\n</ng-container>\n", styles: [".trigger{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);display:flex;gap:var(--size-small);background-color:var(--surface-light-0);cursor:pointer;padding-left:var(--size-small)}.trigger:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.trigger:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1);cursor:default}.selected-count{font-size:var(--type-1-font-size);line-height:var(--type-1-line-height-0);font-weight:var(--font-weight-normal);color:var(--type-dark-body);border-radius:calc(var(--base-grid-size) * 3);background-color:var(--brand);padding:calc(var(--base-grid-size) / 4) calc(var(--base-grid-size) * 2);align-self:center}.value{font-size:var(--type-2-font-size);line-height:var(--type-2-line-height-0);color:var(--type-light-high-contrast);padding:var(--size-small) 0;flex-grow:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:pre}.value.placeholder{color:var(--type-light-disabled)}.chevron{display:flex;justify-content:center;align-items:center;padding:var(--size-small);background-color:var(--surface-light-2);border-left:var(--border-width) solid var(--border-light)}.content-body{padding:var(--size-large);display:flex;flex-direction:column;gap:var(--size-large)}.content-body:not(.inline){height:calc(var(--base-grid-size) * 120);max-height:50vh;width:calc(var(--base-grid-size) * 75);max-width:50vw}.options{flex-grow:1;overflow-y:auto;gap:var(--size-medium)}.options,.group{display:flex;flex-direction:column}.group{gap:var(--size-xsmall)}.group.divider:not(:last-child){padding-bottom:var(--size-medium);border-bottom:var(--border-width) solid var(--border-light)}.display-limit{font:var(--body-small);color:var(--type-light-disabled);padding:var(--size-small);text-align:center}.header{font:var(--input-medium);color:var(--type-light-low-contrast);padding:var(--size-xsmall) 0}.custom-footer{padding-top:var(--size-large);border-top:var(--border-width) solid var(--border-light)}\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: IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }, { kind: "component", type: InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText"], outputs: ["labelAction"] }, { kind: "component", type: LoadingCoverComponent, selector: "riv-loading-cover", inputs: ["loading", "loadingSize", "errorMessage"] }, { kind: "directive", type: OverlayDirective, selector: "[riv-overlay]" }, { kind: "component", type: SearchComponent, selector: "riv-search", inputs: ["placeholder", "name"] }, { kind: "component", type: SelectNodeComponent, selector: "riv-select-node", inputs: ["mode", "node", "showSingleSelected"], outputs: ["selectChange", "expandChange"] }, { kind: "component", type: ZeroStateComponent, selector: "riv-zero-state", inputs: ["message"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: NumberPipe, name: "rivNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2952
|
+
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectComponent, selector: "riv-select", inputs: { manager: "manager", disabled: "disabled", locked: "locked" }, queries: [{ propertyName: "triggerTemplate", first: true, predicate: ["trigger"], descendants: true }, { propertyName: "optionTemplate", first: true, predicate: ["option"], descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true }, { propertyName: "footerTemplate", first: true, predicate: ["footer"], descendants: true }], viewQueries: [{ propertyName: "customTriggerButton", first: true, predicate: ["customTriggerButton"], descendants: true }, { propertyName: "standardTriggerButton", first: true, predicate: ["standardTriggerButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"manager?.state | async; let s\">\n <ng-template #content>\n <riv-loading-cover [loading]=\"s.load.loading\">\n <div class=\"content-body\" [class.inline]=\"s.display.inline\">\n <header *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"headerTemplate; context: { state: s }\"\n ></ng-container>\n </header>\n <riv-search\n *ngIf=\"s.query.allowSearch\"\n [value]=\"s.query.search\"\n (valueChange)=\"\n manager?.actions?.next({ type: 'searchChange', payload: $event })\n \"\n ></riv-search>\n <div class=\"options\">\n <riv-select-node\n *ngIf=\"\n s.selection.allowMultiSelect &&\n s.selection.allowSelectAll &&\n !s.display.zeroStateMessage\n \"\n [mode]=\"'multi'\"\n [node]=\"{\n id: '__NOOP__',\n title: s.query.search ? 'Select all matching' : 'Select all',\n selected: s.selection.visibleSelectionState,\n selectable: true,\n expandable: false,\n expanded: false\n }\"\n (selectChange)=\"\n manager?.actions?.next({ type: 'visibleSelectedChange' })\n \"\n ></riv-select-node>\n <div\n *ngFor=\"let group of s.fullOptionGroups\"\n class=\"group\"\n [class.divider]=\"s.display.dividers\"\n >\n <span *ngIf=\"group.header; let header\" class=\"header\">\n {{ header }}\n </span>\n <ng-container *ngFor=\"let option of group.options\">\n <ng-container *ngIf=\"optionTemplate; else standardTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ node: option }\"\n ></ng-container>\n </ng-container>\n <ng-template #standardTemplate>\n <riv-select-node\n [mode]=\"s.selection.allowMultiSelect ? 'multi' : 'single'\"\n [node]=\"option\"\n [showSingleSelected]=\"s.display.showSingleSelected\"\n (selectChange)=\"\n selectChange(s.selection.allowMultiSelect, $event)\n \"\n (expandChange)=\"\n manager?.actions?.next({\n type: 'toggleOptionExpanded',\n id: $event\n })\n \"\n ></riv-select-node>\n </ng-template>\n </ng-container>\n </div>\n <span\n *ngIf=\"s.display.displayLimitMessage; let message\"\n class=\"display-limit\"\n >\n {{ message }}\n </span>\n <riv-zero-state\n *ngIf=\"s.display.zeroStateMessage; let message\"\n [message]=\"message\"\n ></riv-zero-state>\n </div>\n <footer *ngIf=\"footerTemplate\" class=\"custom-footer\">\n <ng-container\n *ngTemplateOutlet=\"footerTemplate; context: { state: s }\"\n ></ng-container>\n </footer>\n </div>\n </riv-loading-cover>\n </ng-template>\n\n <ng-container *ngIf=\"!s.display.inline; else content\">\n <ng-container *ngIf=\"triggerTemplate; else standardTrigger\">\n <button\n #customTriggerButton\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n [ngTemplateOutlet]=\"triggerTemplate\"\n [ngTemplateOutletContext]=\"{ state: s }\"\n ></ng-container>\n </button>\n </ng-container>\n <ng-template #standardTrigger>\n <riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n >\n <button\n #standardTriggerButton\n class=\"trigger\"\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n *ngIf=\"s.selection.selected.size; else placeholderValue\"\n >\n <span *ngIf=\"s.selection.selected.size > 1\" class=\"selected-count\">\n {{ s.selection.selected.size | rivNumber }}\n </span>\n <span class=\"value\">{{ s.display.selected }}</span>\n </ng-container>\n <ng-template #placeholderValue>\n <span class=\"value placeholder\">{{ s.display.placeholder }}</span>\n </ng-template>\n <span class=\"chevron\">\n <riv-icon\n *ngIf=\"!locked\"\n [name]=\"'ChevronDown'\"\n [size]=\"16\"\n ></riv-icon>\n <riv-icon *ngIf=\"locked\" [name]=\"'Lock'\" [size]=\"16\"></riv-icon>\n </span>\n </button>\n </riv-input-label>\n </ng-template>\n\n <ng-container *ngIf=\"s.display.open\">\n <riv-callout\n *riv-overlay\n [anchor]=\"getTrigger()\"\n [theme]=\"'light'\"\n [showCaret]=\"false\"\n [allowedPositions]=\"[\n 'top-left',\n 'top-center',\n 'top-right',\n 'bottom-right',\n 'bottom-center',\n 'bottom-left'\n ]\"\n (close)=\"manager?.actions?.next({ type: 'openChange', open: false })\"\n >\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n </riv-callout>\n </ng-container>\n </ng-container>\n</ng-container>\n", styles: [".trigger{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);display:flex;gap:var(--size-small);background-color:var(--surface-light-0);cursor:pointer;padding-left:var(--size-small)}.trigger:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.trigger:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1);cursor:default}.selected-count{font-size:var(--type-1-font-size);line-height:var(--type-1-line-height-0);font-weight:var(--font-weight-normal);color:var(--type-dark-body);border-radius:calc(var(--base-grid-size) * 3);background-color:var(--brand);padding:calc(var(--base-grid-size) / 4) calc(var(--base-grid-size) * 2);align-self:center}.value{font-size:var(--type-2-font-size);line-height:var(--type-2-line-height-0);color:var(--type-light-high-contrast);padding:var(--size-small) 0;flex-grow:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:pre}.value.placeholder{color:var(--type-light-disabled)}.chevron{display:flex;justify-content:center;align-items:center;padding:var(--size-small);background-color:var(--surface-light-2);border-left:var(--border-width) solid var(--border-light)}.content-body{padding:var(--size-large);display:flex;flex-direction:column;gap:var(--size-large)}.content-body:not(.inline){max-height:50vh;width:calc(var(--base-grid-size) * 75);max-width:50vw}.options{flex-grow:1;overflow-y:auto;gap:var(--size-medium)}.options,.group{display:flex;flex-direction:column}.group{gap:var(--size-xsmall)}.group.divider:not(:last-child){padding-bottom:var(--size-medium);border-bottom:var(--border-width) solid var(--border-light)}.display-limit{font:var(--body-small);color:var(--type-light-disabled);padding:var(--size-small);text-align:center}.header{font:var(--input-medium);color:var(--type-light-low-contrast);padding:var(--size-xsmall) 0}.custom-footer{padding-top:var(--size-large);border-top:var(--border-width) solid var(--border-light)}\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: IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }, { kind: "component", type: InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText"], outputs: ["labelAction"] }, { kind: "component", type: LoadingCoverComponent, selector: "riv-loading-cover", inputs: ["loading", "loadingSize", "errorMessage"] }, { kind: "directive", type: OverlayDirective, selector: "[riv-overlay]" }, { kind: "component", type: SearchComponent, selector: "riv-search", inputs: ["placeholder", "name"] }, { kind: "component", type: SelectNodeComponent, selector: "riv-select-node", inputs: ["mode", "node", "showSingleSelected"], outputs: ["selectChange", "expandChange"] }, { kind: "component", type: ZeroStateComponent, selector: "riv-zero-state", inputs: ["message"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: NumberPipe, name: "rivNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2948
2953
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectComponent, decorators: [{
|
|
2949
2954
|
type: Component,
|
|
2950
|
-
args: [{ selector: 'riv-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"manager?.state | async; let s\">\n <ng-template #content>\n <riv-loading-cover [loading]=\"s.load.loading\">\n <div class=\"content-body\" [class.inline]=\"s.display.inline\">\n <header *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"headerTemplate; context: { state: s }\"\n ></ng-container>\n </header>\n <riv-search\n *ngIf=\"s.query.allowSearch\"\n [value]=\"s.query.search\"\n (valueChange)=\"\n manager?.actions?.next({ type: 'searchChange', payload: $event })\n \"\n ></riv-search>\n <div class=\"options\">\n <riv-select-node\n *ngIf=\"\n s.selection.allowMultiSelect &&\n s.selection.allowSelectAll &&\n !s.display.zeroStateMessage\n \"\n [mode]=\"'multi'\"\n [node]=\"{\n id: '__NOOP__',\n title: s.query.search ? 'Select all matching' : 'Select all',\n selected: s.selection.visibleSelectionState,\n selectable: true,\n expandable: false,\n expanded: false\n }\"\n (selectChange)=\"\n manager?.actions?.next({ type: 'visibleSelectedChange' })\n \"\n ></riv-select-node>\n <div\n *ngFor=\"let group of s.fullOptionGroups\"\n class=\"group\"\n [class.divider]=\"s.display.dividers\"\n >\n <span *ngIf=\"group.header; let header\" class=\"header\">\n {{ header }}\n </span>\n <ng-container *ngFor=\"let option of group.options\">\n <ng-container *ngIf=\"optionTemplate; else standardTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ node: option }\"\n ></ng-container>\n </ng-container>\n <ng-template #standardTemplate>\n <riv-select-node\n [mode]=\"s.selection.allowMultiSelect ? 'multi' : 'single'\"\n [node]=\"option\"\n [showSingleSelected]=\"s.display.showSingleSelected\"\n (selectChange)=\"\n selectChange(s.selection.allowMultiSelect, $event)\n \"\n (expandChange)=\"\n manager?.actions?.next({\n type: 'toggleOptionExpanded',\n id: $event\n })\n \"\n ></riv-select-node>\n </ng-template>\n </ng-container>\n </div>\n <span\n *ngIf=\"s.display.displayLimitMessage; let message\"\n class=\"display-limit\"\n >\n {{ message }}\n </span>\n <riv-zero-state\n *ngIf=\"s.display.zeroStateMessage; let message\"\n [message]=\"message\"\n ></riv-zero-state>\n </div>\n <footer *ngIf=\"footerTemplate\" class=\"custom-footer\">\n <ng-container\n *ngTemplateOutlet=\"footerTemplate; context: { state: s }\"\n ></ng-container>\n </footer>\n </div>\n </riv-loading-cover>\n </ng-template>\n\n <ng-container *ngIf=\"!s.display.inline; else content\">\n <ng-container *ngIf=\"triggerTemplate; else standardTrigger\">\n <button\n #customTriggerButton\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n [ngTemplateOutlet]=\"triggerTemplate\"\n [ngTemplateOutletContext]=\"{ state: s }\"\n ></ng-container>\n </button>\n </ng-container>\n <ng-template #standardTrigger>\n <riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n >\n <button\n #standardTriggerButton\n class=\"trigger\"\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n *ngIf=\"s.selection.selected.size; else placeholderValue\"\n >\n <span *ngIf=\"s.selection.selected.size > 1\" class=\"selected-count\">\n {{ s.selection.selected.size | rivNumber }}\n </span>\n <span class=\"value\">{{ s.display.selected }}</span>\n </ng-container>\n <ng-template #placeholderValue>\n <span class=\"value placeholder\">{{ s.display.placeholder }}</span>\n </ng-template>\n <span class=\"chevron\">\n <riv-icon\n *ngIf=\"!locked\"\n [name]=\"'ChevronDown'\"\n [size]=\"16\"\n ></riv-icon>\n <riv-icon *ngIf=\"locked\" [name]=\"'Lock'\" [size]=\"16\"></riv-icon>\n </span>\n </button>\n </riv-input-label>\n </ng-template>\n\n <ng-container *ngIf=\"s.display.open\">\n <riv-callout\n *riv-overlay\n [anchor]=\"getTrigger()\"\n [theme]=\"'light'\"\n [showCaret]=\"false\"\n [allowedPositions]=\"[\n 'top-left',\n 'top-center',\n 'top-right',\n 'bottom-right',\n 'bottom-center',\n 'bottom-left'\n ]\"\n (close)=\"manager?.actions?.next({ type: 'openChange', open: false })\"\n >\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n </riv-callout>\n </ng-container>\n </ng-container>\n</ng-container>\n", styles: [".trigger{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);display:flex;gap:var(--size-small);background-color:var(--surface-light-0);cursor:pointer;padding-left:var(--size-small)}.trigger:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.trigger:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1);cursor:default}.selected-count{font-size:var(--type-1-font-size);line-height:var(--type-1-line-height-0);font-weight:var(--font-weight-normal);color:var(--type-dark-body);border-radius:calc(var(--base-grid-size) * 3);background-color:var(--brand);padding:calc(var(--base-grid-size) / 4) calc(var(--base-grid-size) * 2);align-self:center}.value{font-size:var(--type-2-font-size);line-height:var(--type-2-line-height-0);color:var(--type-light-high-contrast);padding:var(--size-small) 0;flex-grow:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:pre}.value.placeholder{color:var(--type-light-disabled)}.chevron{display:flex;justify-content:center;align-items:center;padding:var(--size-small);background-color:var(--surface-light-2);border-left:var(--border-width) solid var(--border-light)}.content-body{padding:var(--size-large);display:flex;flex-direction:column;gap:var(--size-large)}.content-body:not(.inline){
|
|
2955
|
+
args: [{ selector: 'riv-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"manager?.state | async; let s\">\n <ng-template #content>\n <riv-loading-cover [loading]=\"s.load.loading\">\n <div class=\"content-body\" [class.inline]=\"s.display.inline\">\n <header *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"headerTemplate; context: { state: s }\"\n ></ng-container>\n </header>\n <riv-search\n *ngIf=\"s.query.allowSearch\"\n [value]=\"s.query.search\"\n (valueChange)=\"\n manager?.actions?.next({ type: 'searchChange', payload: $event })\n \"\n ></riv-search>\n <div class=\"options\">\n <riv-select-node\n *ngIf=\"\n s.selection.allowMultiSelect &&\n s.selection.allowSelectAll &&\n !s.display.zeroStateMessage\n \"\n [mode]=\"'multi'\"\n [node]=\"{\n id: '__NOOP__',\n title: s.query.search ? 'Select all matching' : 'Select all',\n selected: s.selection.visibleSelectionState,\n selectable: true,\n expandable: false,\n expanded: false\n }\"\n (selectChange)=\"\n manager?.actions?.next({ type: 'visibleSelectedChange' })\n \"\n ></riv-select-node>\n <div\n *ngFor=\"let group of s.fullOptionGroups\"\n class=\"group\"\n [class.divider]=\"s.display.dividers\"\n >\n <span *ngIf=\"group.header; let header\" class=\"header\">\n {{ header }}\n </span>\n <ng-container *ngFor=\"let option of group.options\">\n <ng-container *ngIf=\"optionTemplate; else standardTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ node: option }\"\n ></ng-container>\n </ng-container>\n <ng-template #standardTemplate>\n <riv-select-node\n [mode]=\"s.selection.allowMultiSelect ? 'multi' : 'single'\"\n [node]=\"option\"\n [showSingleSelected]=\"s.display.showSingleSelected\"\n (selectChange)=\"\n selectChange(s.selection.allowMultiSelect, $event)\n \"\n (expandChange)=\"\n manager?.actions?.next({\n type: 'toggleOptionExpanded',\n id: $event\n })\n \"\n ></riv-select-node>\n </ng-template>\n </ng-container>\n </div>\n <span\n *ngIf=\"s.display.displayLimitMessage; let message\"\n class=\"display-limit\"\n >\n {{ message }}\n </span>\n <riv-zero-state\n *ngIf=\"s.display.zeroStateMessage; let message\"\n [message]=\"message\"\n ></riv-zero-state>\n </div>\n <footer *ngIf=\"footerTemplate\" class=\"custom-footer\">\n <ng-container\n *ngTemplateOutlet=\"footerTemplate; context: { state: s }\"\n ></ng-container>\n </footer>\n </div>\n </riv-loading-cover>\n </ng-template>\n\n <ng-container *ngIf=\"!s.display.inline; else content\">\n <ng-container *ngIf=\"triggerTemplate; else standardTrigger\">\n <button\n #customTriggerButton\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n [ngTemplateOutlet]=\"triggerTemplate\"\n [ngTemplateOutletContext]=\"{ state: s }\"\n ></ng-container>\n </button>\n </ng-container>\n <ng-template #standardTrigger>\n <riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n >\n <button\n #standardTriggerButton\n class=\"trigger\"\n (click)=\"allowedOpen()\"\n [disabled]=\"disabled || locked\"\n type=\"button\"\n >\n <ng-container\n *ngIf=\"s.selection.selected.size; else placeholderValue\"\n >\n <span *ngIf=\"s.selection.selected.size > 1\" class=\"selected-count\">\n {{ s.selection.selected.size | rivNumber }}\n </span>\n <span class=\"value\">{{ s.display.selected }}</span>\n </ng-container>\n <ng-template #placeholderValue>\n <span class=\"value placeholder\">{{ s.display.placeholder }}</span>\n </ng-template>\n <span class=\"chevron\">\n <riv-icon\n *ngIf=\"!locked\"\n [name]=\"'ChevronDown'\"\n [size]=\"16\"\n ></riv-icon>\n <riv-icon *ngIf=\"locked\" [name]=\"'Lock'\" [size]=\"16\"></riv-icon>\n </span>\n </button>\n </riv-input-label>\n </ng-template>\n\n <ng-container *ngIf=\"s.display.open\">\n <riv-callout\n *riv-overlay\n [anchor]=\"getTrigger()\"\n [theme]=\"'light'\"\n [showCaret]=\"false\"\n [allowedPositions]=\"[\n 'top-left',\n 'top-center',\n 'top-right',\n 'bottom-right',\n 'bottom-center',\n 'bottom-left'\n ]\"\n (close)=\"manager?.actions?.next({ type: 'openChange', open: false })\"\n >\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n </riv-callout>\n </ng-container>\n </ng-container>\n</ng-container>\n", styles: [".trigger{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);display:flex;gap:var(--size-small);background-color:var(--surface-light-0);cursor:pointer;padding-left:var(--size-small)}.trigger:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.trigger:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1);cursor:default}.selected-count{font-size:var(--type-1-font-size);line-height:var(--type-1-line-height-0);font-weight:var(--font-weight-normal);color:var(--type-dark-body);border-radius:calc(var(--base-grid-size) * 3);background-color:var(--brand);padding:calc(var(--base-grid-size) / 4) calc(var(--base-grid-size) * 2);align-self:center}.value{font-size:var(--type-2-font-size);line-height:var(--type-2-line-height-0);color:var(--type-light-high-contrast);padding:var(--size-small) 0;flex-grow:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:pre}.value.placeholder{color:var(--type-light-disabled)}.chevron{display:flex;justify-content:center;align-items:center;padding:var(--size-small);background-color:var(--surface-light-2);border-left:var(--border-width) solid var(--border-light)}.content-body{padding:var(--size-large);display:flex;flex-direction:column;gap:var(--size-large)}.content-body:not(.inline){max-height:50vh;width:calc(var(--base-grid-size) * 75);max-width:50vw}.options{flex-grow:1;overflow-y:auto;gap:var(--size-medium)}.options,.group{display:flex;flex-direction:column}.group{gap:var(--size-xsmall)}.group.divider:not(:last-child){padding-bottom:var(--size-medium);border-bottom:var(--border-width) solid var(--border-light)}.display-limit{font:var(--body-small);color:var(--type-light-disabled);padding:var(--size-small);text-align:center}.header{font:var(--input-medium);color:var(--type-light-low-contrast);padding:var(--size-xsmall) 0}.custom-footer{padding-top:var(--size-large);border-top:var(--border-width) solid var(--border-light)}\n"] }]
|
|
2951
2956
|
}], propDecorators: { manager: [{
|
|
2952
2957
|
type: Input
|
|
2953
2958
|
}], disabled: [{
|
|
@@ -3716,18 +3721,23 @@ class ModalComponent {
|
|
|
3716
3721
|
constructor() {
|
|
3717
3722
|
this.obscure = false;
|
|
3718
3723
|
this.close = new EventEmitter();
|
|
3724
|
+
this.mouseDownStartedInScrim = false;
|
|
3725
|
+
}
|
|
3726
|
+
onScrimMouseDown(evt) {
|
|
3727
|
+
this.mouseDownStartedInScrim = evt.target === evt.currentTarget;
|
|
3719
3728
|
}
|
|
3720
|
-
|
|
3721
|
-
if (evt.target === evt.currentTarget) {
|
|
3729
|
+
onScrimMouseUp(evt) {
|
|
3730
|
+
if (this.mouseDownStartedInScrim && evt.target === evt.currentTarget) {
|
|
3722
3731
|
this.close.emit();
|
|
3723
3732
|
}
|
|
3733
|
+
this.mouseDownStartedInScrim = false;
|
|
3724
3734
|
}
|
|
3725
3735
|
}
|
|
3726
3736
|
ModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3727
|
-
ModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ModalComponent, selector: "riv-modal", inputs: { obscure: "obscure" }, outputs: { close: "close" }, ngImport: i0, template: "<div\n #scrim\n *riv-overlay\n [rivLockScroll]=\"true\"\n class=\"scrim\"\n [class.obscure]=\"obscure\"\n (
|
|
3737
|
+
ModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ModalComponent, selector: "riv-modal", inputs: { obscure: "obscure" }, outputs: { close: "close" }, ngImport: i0, template: "<div\n #scrim\n *riv-overlay\n [rivLockScroll]=\"true\"\n class=\"scrim\"\n [class.obscure]=\"obscure\"\n (mousedown)=\"onScrimMouseDown($event)\"\n (mouseup)=\"onScrimMouseUp($event)\"\n (touchstart)=\"onScrimMouseDown($event)\"\n (touchend)=\"onScrimMouseUp($event)\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [".scrim{position:fixed;z-index:var(--callout-z-index);cursor:default;inset:0}.scrim.obscure{background-color:var(--modal-scrim)}\n"], dependencies: [{ kind: "directive", type: LockScrollDirective, selector: "[rivLockScroll]", inputs: ["rivLockScroll"] }, { kind: "directive", type: OverlayDirective, selector: "[riv-overlay]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3728
3738
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ModalComponent, decorators: [{
|
|
3729
3739
|
type: Component,
|
|
3730
|
-
args: [{ selector: 'riv-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n #scrim\n *riv-overlay\n [rivLockScroll]=\"true\"\n class=\"scrim\"\n [class.obscure]=\"obscure\"\n (
|
|
3740
|
+
args: [{ selector: 'riv-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n #scrim\n *riv-overlay\n [rivLockScroll]=\"true\"\n class=\"scrim\"\n [class.obscure]=\"obscure\"\n (mousedown)=\"onScrimMouseDown($event)\"\n (mouseup)=\"onScrimMouseUp($event)\"\n (touchstart)=\"onScrimMouseDown($event)\"\n (touchend)=\"onScrimMouseUp($event)\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [".scrim{position:fixed;z-index:var(--callout-z-index);cursor:default;inset:0}.scrim.obscure{background-color:var(--modal-scrim)}\n"] }]
|
|
3731
3741
|
}], propDecorators: { obscure: [{
|
|
3732
3742
|
type: Input
|
|
3733
3743
|
}], close: [{
|