UNPKG

carbon-components-angular

Version:
180 lines 14.3 kB
import { Component, Input, Output, EventEmitter, TemplateRef, HostBinding } from "@angular/core"; import * as i0 from "@angular/core"; import * as i1 from "@angular/common"; /** * The `Tab` component is a child of the `Tabs` component. * It represents one `Tab` item and its content within a panel of other `Tab` items. * * * `Tab` takes a string or `TemplateRef` for the header, and any content for the body of the tab. * Disabled states should be handled by the application (ie. switch to the tab, but display some * indication as to _why_ the tab is disabled). * * When the tab is selected the `select` output will be triggered. * The `select` output will also be triggered for the active tab when the tabs are loaded or updated. * * * Tab with string header: * * ```html * <cds-tab heading='tab1'> * tab 1 content * </cds-tab> * ``` * * Tab with custom header: * * ```html * <ng-template #tabHeading> * <svg cdsIcon="facebook" * size="sm" * style="margin-right: 7px;"> * </svg> * Hello Tab 1 * </ng-template> * <cds-tabs> * <cds-tab [heading]="tabHeading"> * Tab 1 content <svg cdsIcon="alert" size="lg"></svg> * </cds-tab> * <cds-tab heading='Tab2'> * Tab 2 content * </cds-tab> * <cds-tab heading='Tab3'> * Tab 3 content * </cds-tab> * </cds-tabs> * ``` */ export class Tab { constructor() { /** * Boolean value reflects if the `Tab` is using a custom template for the heading. * Default value is false. */ this.headingIsTemplate = false; /** * Indicates whether the `Tab` is active/selected. * Determines whether it's `TabPanel` is rendered. */ this.active = false; /** * Indicates whether or not the `Tab` item is disabled. */ this.disabled = false; this.tabIndex = 0; /** * Sets the id of the `Tab`. Will be uniquely generated if not provided. */ this.id = `n-tab-${Tab.counter++}`; /** * Value 'selected' to be emitted after a new `Tab` is selected. */ this.selected = new EventEmitter(); /** * Used to set the id property on the element. */ this.attrClass = this.id; this._cacheActive = false; } /** * Set to true to have Tab items cached and not reloaded on tab switching. */ set cacheActive(shouldCache) { this._cacheActive = shouldCache; } get cacheActive() { return this._cacheActive; } /** * Checks for custom heading template on initialization and updates the value * of the boolean 'headingIsTemplate'. */ ngOnInit() { if (this.heading instanceof TemplateRef) { this.headingIsTemplate = true; } } /** * Emit the status of the `Tab`, specifically 'select' and 'selected' properties. */ doSelect() { this.selected.emit(); } /** * Returns value indicating whether this `Tab` should be rendered in a `TabPanel`. */ shouldRender() { return this.active || this.cacheActive; } isTemplate(value) { return value instanceof TemplateRef; } } Tab.counter = 0; Tab.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: Tab, deps: [], target: i0.ɵɵFactoryTarget.Component }); Tab.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: Tab, selector: "cds-tab, ibm-tab", inputs: { heading: "heading", title: "title", context: "context", active: "active", disabled: "disabled", tabIndex: "tabIndex", id: "id", cacheActive: "cacheActive", tabContent: "tabContent", templateContext: "templateContext" }, outputs: { selected: "selected" }, host: { properties: { "attr.id": "this.attrClass" } }, ngImport: i0, template: ` <div [attr.tabindex]="tabIndex" role="tabpanel" *ngIf="shouldRender()" class="cds--tab-content" [ngStyle]="{'display': active ? null : 'none'}" [attr.aria-labelledby]="id + '-header'" aria-live="polite"> <ng-template *ngIf="isTemplate(tabContent)" [ngTemplateOutlet]="tabContent" [ngTemplateOutletContext]="{ $implicit: templateContext }"> </ng-template> <ng-content></ng-content> </div> `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: Tab, decorators: [{ type: Component, args: [{ selector: "cds-tab, ibm-tab", template: ` <div [attr.tabindex]="tabIndex" role="tabpanel" *ngIf="shouldRender()" class="cds--tab-content" [ngStyle]="{'display': active ? null : 'none'}" [attr.aria-labelledby]="id + '-header'" aria-live="polite"> <ng-template *ngIf="isTemplate(tabContent)" [ngTemplateOutlet]="tabContent" [ngTemplateOutletContext]="{ $implicit: templateContext }"> </ng-template> <ng-content></ng-content> </div> ` }] }], propDecorators: { heading: [{ type: Input }], title: [{ type: Input }], context: [{ type: Input }], active: [{ type: Input }], disabled: [{ type: Input }], tabIndex: [{ type: Input }], id: [{ type: Input }], cacheActive: [{ type: Input }], tabContent: [{ type: Input }], templateContext: [{ type: Input }], selected: [{ type: Output }], attrClass: [{ type: HostBinding, args: ["attr.id"] }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFiLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy90YWJzL3RhYi5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNOLFNBQVMsRUFFVCxLQUFLLEVBQ0wsTUFBTSxFQUNOLFlBQVksRUFDWixXQUFXLEVBQ1gsV0FBVyxFQUNYLE1BQU0sZUFBZSxDQUFDOzs7QUFFdkI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7RUEyQ0U7QUFxQkYsTUFBTSxPQUFPLEdBQUc7SUFwQmhCO1FBc0JDOzs7V0FHRztRQUNJLHNCQUFpQixHQUFHLEtBQUssQ0FBQztRQWlCakM7OztXQUdHO1FBQ00sV0FBTSxHQUFHLEtBQUssQ0FBQztRQUN4Qjs7V0FFRztRQUNNLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFFakIsYUFBUSxHQUFHLENBQUMsQ0FBQztRQUN0Qjs7V0FFRztRQUNNLE9BQUUsR0FBRyxTQUFTLEdBQUcsQ0FBQyxPQUFPLEVBQUUsRUFBRSxDQUFDO1FBZXZDOztXQUVHO1FBQ08sYUFBUSxHQUF1QixJQUFJLFlBQVksRUFBUSxDQUFDO1FBQ2xFOztXQUVHO1FBQ3FCLGNBQVMsR0FBRyxJQUFJLENBQUMsRUFBRSxDQUFDO1FBTWxDLGlCQUFZLEdBQUcsS0FBSyxDQUFDO0tBNkIvQjtJQXhEQTs7T0FFRztJQUNILElBQWEsV0FBVyxDQUFDLFdBQW9CO1FBQzVDLElBQUksQ0FBQyxZQUFZLEdBQUcsV0FBVyxDQUFDO0lBQ2pDLENBQUM7SUFrQkQsSUFBSSxXQUFXO1FBQ2QsT0FBTyxJQUFJLENBQUMsWUFBWSxDQUFDO0lBQzFCLENBQUM7SUFJRDs7O09BR0c7SUFDSCxRQUFRO1FBQ1AsSUFBSSxJQUFJLENBQUMsT0FBTyxZQUFZLFdBQVcsRUFBRTtZQUN4QyxJQUFJLENBQUMsaUJBQWlCLEdBQUcsSUFBSSxDQUFDO1NBQzlCO0lBQ0YsQ0FBQztJQUVEOztPQUVHO0lBQ0gsUUFBUTtRQUNQLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDdEIsQ0FBQztJQUVEOztNQUVFO0lBQ0YsWUFBWTtRQUNYLE9BQU8sSUFBSSxDQUFDLE1BQU0sSUFBSSxJQUFJLENBQUMsV0FBVyxDQUFDO0lBQ3hDLENBQUM7SUFFTSxVQUFVLENBQUMsS0FBSztRQUN0QixPQUFPLEtBQUssWUFBWSxXQUFXLENBQUM7SUFDckMsQ0FBQzs7QUE1RmMsV0FBTyxHQUFHLENBQUUsQ0FBQTtnR0FEZixHQUFHO29GQUFILEdBQUcsd1hBbEJMOzs7Ozs7Ozs7Ozs7Ozs7O0VBZ0JUOzJGQUVXLEdBQUc7a0JBcEJmLFNBQVM7bUJBQUM7b0JBQ1YsUUFBUSxFQUFFLGtCQUFrQjtvQkFDNUIsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7Ozs7O0VBZ0JUO2lCQUNEOzhCQVlTLE9BQU87c0JBQWYsS0FBSztnQkFPRyxLQUFLO3NCQUFiLEtBQUs7Z0JBSUcsT0FBTztzQkFBZixLQUFLO2dCQUtHLE1BQU07c0JBQWQsS0FBSztnQkFJRyxRQUFRO3NCQUFoQixLQUFLO2dCQUVHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBSUcsRUFBRTtzQkFBVixLQUFLO2dCQUlPLFdBQVc7c0JBQXZCLEtBQUs7Z0JBTUcsVUFBVTtzQkFBbEIsS0FBSztnQkFJRyxlQUFlO3NCQUF2QixLQUFLO2dCQUlJLFFBQVE7c0JBQWpCLE1BQU07Z0JBSWlCLFNBQVM7c0JBQWhDLFdBQVc7dUJBQUMsU0FBUyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG5cdENvbXBvbmVudCxcblx0T25Jbml0LFxuXHRJbnB1dCxcblx0T3V0cHV0LFxuXHRFdmVudEVtaXR0ZXIsXG5cdFRlbXBsYXRlUmVmLFxuXHRIb3N0QmluZGluZ1xufSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuXG4vKipcbiogVGhlIGBUYWJgIGNvbXBvbmVudCBpcyBhIGNoaWxkIG9mIHRoZSBgVGFic2AgY29tcG9uZW50LlxuKiBJdCByZXByZXNlbnRzIG9uZSBgVGFiYCBpdGVtIGFuZCBpdHMgY29udGVudCB3aXRoaW4gYSBwYW5lbCBvZiBvdGhlciBgVGFiYCBpdGVtcy5cbipcbipcbiogYFRhYmAgdGFrZXMgYSBzdHJpbmcgb3IgYFRlbXBsYXRlUmVmYCBmb3IgdGhlIGhlYWRlciwgYW5kIGFueSBjb250ZW50IGZvciB0aGUgYm9keSBvZiB0aGUgdGFiLlxuKiBEaXNhYmxlZCBzdGF0ZXMgc2hvdWxkIGJlIGhhbmRsZWQgYnkgdGhlIGFwcGxpY2F0aW9uIChpZS4gc3dpdGNoIHRvIHRoZSB0YWIsIGJ1dCBkaXNwbGF5IHNvbWVcbiogaW5kaWNhdGlvbiBhcyB0byBfd2h5XyB0aGUgdGFiIGlzIGRpc2FibGVkKS5cbipcbiogV2hlbiB0aGUgdGFiIGlzIHNlbGVjdGVkIHRoZSBgc2VsZWN0YCBvdXRwdXQgd2lsbCBiZSB0cmlnZ2VyZWQuXG4qIFRoZSBgc2VsZWN0YCBvdXRwdXQgd2lsbCBhbHNvIGJlIHRyaWdnZXJlZCBmb3IgdGhlIGFjdGl2ZSB0YWIgd2hlbiB0aGUgdGFicyBhcmUgbG9hZGVkIG9yIHVwZGF0ZWQuXG4qXG4qXG4qIFRhYiB3aXRoIHN0cmluZyBoZWFkZXI6XG4qXG4qIGBgYGh0bWxcbiogPGNkcy10YWIgaGVhZGluZz0ndGFiMSc+XG4qIFx0dGFiIDEgY29udGVudFxuKiA8L2Nkcy10YWI+XG4qIGBgYFxuKlxuKiBUYWIgd2l0aCBjdXN0b20gaGVhZGVyOlxuKlxuKiBgYGBodG1sXG4qIDxuZy10ZW1wbGF0ZSAjdGFiSGVhZGluZz5cbiogXHQ8c3ZnIGNkc0ljb249XCJmYWNlYm9va1wiXG4qIFx0XHRzaXplPVwic21cIlxuKiBcdFx0c3R5bGU9XCJtYXJnaW4tcmlnaHQ6IDdweDtcIj5cbiogXHQ8L3N2Zz5cbiogXHRIZWxsbyBUYWIgMVxuKiA8L25nLXRlbXBsYXRlPlxuKiA8Y2RzLXRhYnM+XG4qIFx0PGNkcy10YWIgW2hlYWRpbmddPVwidGFiSGVhZGluZ1wiPlxuKiBcdFx0VGFiIDEgY29udGVudCA8c3ZnIGNkc0ljb249XCJhbGVydFwiIHNpemU9XCJsZ1wiPjwvc3ZnPlxuKiBcdDwvY2RzLXRhYj5cbiogXHQ8Y2RzLXRhYiBoZWFkaW5nPSdUYWIyJz5cbiogXHRcdFRhYiAyIGNvbnRlbnRcbiogXHQ8L2Nkcy10YWI+XG4qIFx0PGNkcy10YWIgaGVhZGluZz0nVGFiMyc+XG4qIFx0XHRUYWIgMyBjb250ZW50XG4qIFx0PC9jZHMtdGFiPlxuKiA8L2Nkcy10YWJzPlxuKiBgYGBcbiovXG5AQ29tcG9uZW50KHtcblx0c2VsZWN0b3I6IFwiY2RzLXRhYiwgaWJtLXRhYlwiLFxuXHR0ZW1wbGF0ZTogYFxuXHRcdDxkaXZcblx0XHRcdFthdHRyLnRhYmluZGV4XT1cInRhYkluZGV4XCJcblx0XHRcdHJvbGU9XCJ0YWJwYW5lbFwiXG5cdFx0XHQqbmdJZj1cInNob3VsZFJlbmRlcigpXCJcblx0XHRcdGNsYXNzPVwiY2RzLS10YWItY29udGVudFwiXG5cdFx0XHRbbmdTdHlsZV09XCJ7J2Rpc3BsYXknOiBhY3RpdmUgPyBudWxsIDogJ25vbmUnfVwiXG5cdFx0XHRbYXR0ci5hcmlhLWxhYmVsbGVkYnldPVwiaWQgKyAnLWhlYWRlcidcIlxuXHRcdFx0YXJpYS1saXZlPVwicG9saXRlXCI+XG5cdFx0XHQ8bmctdGVtcGxhdGVcblx0XHRcdFx0Km5nSWY9XCJpc1RlbXBsYXRlKHRhYkNvbnRlbnQpXCJcblx0XHRcdFx0W25nVGVtcGxhdGVPdXRsZXRdPVwidGFiQ29udGVudFwiXG5cdFx0XHRcdFtuZ1RlbXBsYXRlT3V0bGV0Q29udGV4dF09XCJ7ICRpbXBsaWNpdDogdGVtcGxhdGVDb250ZXh0IH1cIj5cblx0XHRcdDwvbmctdGVtcGxhdGU+XG5cdFx0XHQ8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG5cdFx0PC9kaXY+XG5cdGBcbn0pXG5leHBvcnQgY2xhc3MgVGFiIGltcGxlbWVudHMgT25Jbml0IHtcblx0cHJpdmF0ZSBzdGF0aWMgY291bnRlciA9IDA7XG5cdC8qKlxuXHQgKiBCb29sZWFuIHZhbHVlIHJlZmxlY3RzIGlmIHRoZSBgVGFiYCBpcyB1c2luZyBhIGN1c3RvbSB0ZW1wbGF0ZSBmb3IgdGhlIGhlYWRpbmcuXG5cdCAqIERlZmF1bHQgdmFsdWUgaXMgZmFsc2UuXG5cdCAqL1xuXHRwdWJsaWMgaGVhZGluZ0lzVGVtcGxhdGUgPSBmYWxzZTtcblxuXHQvKipcblx0ICogVGhlIGBUYWJgJ3MgdGl0bGUgdG8gYmUgZGlzcGxheWVkIG9yIGN1c3RvbSB0ZW1hcGxhdGUgZm9yIHRoZSBgVGFiYCBoZWFkaW5nLlxuXHQgKi9cblx0QElucHV0KCkgaGVhZGluZzogc3RyaW5nIHwgVGVtcGxhdGVSZWY8YW55Pjtcblx0LyoqXG5cdCAqIE9wdGlvbmFsIG92ZXJyaWRlIGZvciB0aGUgYHRhYkl0ZW0nc2AncyB0aXRsZSBhdHRyaWJ1dGUgd2hpY2ggaXMgc2V0IGluIGBUYWJIZWFkZXJzYC5cblx0ICogYHRhYkl0ZW1gJ3MgdGl0bGUgYXR0cmlidXRlIGlzIGF1dG9tYXRpY2FsbHkgc2V0IHRvIGBoZWFkaW5nYC5cblx0ICpcblx0ICogWW91IG1pZ2h0IHdhbnQgdG8gdXNlIHRoaXMgaWYgeW91IHNldCBgaGVhZGluZ2AgdG8gYSBgVGVtcGxhdGVSZWZgLlxuXHQgKi9cblx0QElucHV0KCkgdGl0bGU6IHN0cmluZztcblx0LyoqXG5cdCAqIEFsbG93cyB0aGUgdXNlciB0byBwYXNzIGRhdGEgdG8gdGhlIGN1c3RvbSB0ZW1wbGF0ZSBmb3IgdGhlIGBUYWJgIGhlYWRpbmcuXG5cdCAqL1xuXHRASW5wdXQoKSBjb250ZXh0OiBhbnk7XG5cdC8qKlxuXHQgKiBJbmRpY2F0ZXMgd2hldGhlciB0aGUgYFRhYmAgaXMgYWN0aXZlL3NlbGVjdGVkLlxuXHQgKiBEZXRlcm1pbmVzIHdoZXRoZXIgaXQncyBgVGFiUGFuZWxgIGlzIHJlbmRlcmVkLlxuXHQgKi9cblx0QElucHV0KCkgYWN0aXZlID0gZmFsc2U7XG5cdC8qKlxuXHQgKiBJbmRpY2F0ZXMgd2hldGhlciBvciBub3QgdGhlIGBUYWJgIGl0ZW0gaXMgZGlzYWJsZWQuXG5cdCAqL1xuXHRASW5wdXQoKSBkaXNhYmxlZCA9IGZhbHNlO1xuXG5cdEBJbnB1dCgpIHRhYkluZGV4ID0gMDtcblx0LyoqXG5cdCAqIFNldHMgdGhlIGlkIG9mIHRoZSBgVGFiYC4gV2lsbCBiZSB1bmlxdWVseSBnZW5lcmF0ZWQgaWYgbm90IHByb3ZpZGVkLlxuXHQgKi9cblx0QElucHV0KCkgaWQgPSBgbi10YWItJHtUYWIuY291bnRlcisrfWA7XG5cdC8qKlxuXHQgKiBTZXQgdG8gdHJ1ZSB0byBoYXZlIFRhYiBpdGVtcyBjYWNoZWQgYW5kIG5vdCByZWxvYWRlZCBvbiB0YWIgc3dpdGNoaW5nLlxuXHQgKi9cblx0QElucHV0KCkgc2V0IGNhY2hlQWN0aXZlKHNob3VsZENhY2hlOiBib29sZWFuKSB7XG5cdFx0dGhpcy5fY2FjaGVBY3RpdmUgPSBzaG91bGRDYWNoZTtcblx0fVxuXHQvKipcblx0ICogQWxsb3dzIGxpZmUgY3ljbGUgaG9va3MgdG8gYmUgY2FsbGVkIG9uIHRoZSByZW5kZXJlZCBjb250ZW50XG5cdCAqL1xuXHRASW5wdXQoKSB0YWJDb250ZW50OiBUZW1wbGF0ZVJlZjxhbnk+O1xuXHQvKipcblx0ICogT3B0aW9uYWwgZGF0YSBmb3IgdGVtcGxhdGVzIHBhc3NlZCBhcyBpbXBsaWNpdCBjb250ZXh0XG5cdCAqL1xuXHRASW5wdXQoKSB0ZW1wbGF0ZUNvbnRleHQ6IGFueTtcblx0LyoqXG5cdCAqIFZhbHVlICdzZWxlY3RlZCcgdG8gYmUgZW1pdHRlZCBhZnRlciBhIG5ldyBgVGFiYCBpcyBzZWxlY3RlZC5cblx0ICovXG5cdEBPdXRwdXQoKSBzZWxlY3RlZDogRXZlbnRFbWl0dGVyPHZvaWQ+ID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuXHQvKipcblx0ICogVXNlZCB0byBzZXQgdGhlIGlkIHByb3BlcnR5IG9uIHRoZSBlbGVtZW50LlxuXHQgKi9cblx0QEhvc3RCaW5kaW5nKFwiYXR0ci5pZFwiKSBhdHRyQ2xhc3MgPSB0aGlzLmlkO1xuXG5cdGdldCBjYWNoZUFjdGl2ZSgpIHtcblx0XHRyZXR1cm4gdGhpcy5fY2FjaGVBY3RpdmU7XG5cdH1cblxuXHRwcm90ZWN0ZWQgX2NhY2hlQWN0aXZlID0gZmFsc2U7XG5cblx0LyoqXG5cdCAqIENoZWNrcyBmb3IgY3VzdG9tIGhlYWRpbmcgdGVtcGxhdGUgb24gaW5pdGlhbGl6YXRpb24gYW5kIHVwZGF0ZXMgdGhlIHZhbHVlXG5cdCAqIG9mIHRoZSBib29sZWFuICdoZWFkaW5nSXNUZW1wbGF0ZScuXG5cdCAqL1xuXHRuZ09uSW5pdCgpIHtcblx0XHRpZiAodGhpcy5oZWFkaW5nIGluc3RhbmNlb2YgVGVtcGxhdGVSZWYpIHtcblx0XHRcdHRoaXMuaGVhZGluZ0lzVGVtcGxhdGUgPSB0cnVlO1xuXHRcdH1cblx0fVxuXG5cdC8qKlxuXHQgKiBFbWl0IHRoZSBzdGF0dXMgb2YgdGhlIGBUYWJgLCBzcGVjaWZpY2FsbHkgJ3NlbGVjdCcgYW5kICdzZWxlY3RlZCcgcHJvcGVydGllcy5cblx0ICovXG5cdGRvU2VsZWN0KCkge1xuXHRcdHRoaXMuc2VsZWN0ZWQuZW1pdCgpO1xuXHR9XG5cblx0LyoqXG5cdCogUmV0dXJucyB2YWx1ZSBpbmRpY2F0aW5nIHdoZXRoZXIgdGhpcyBgVGFiYCBzaG91bGQgYmUgcmVuZGVyZWQgaW4gYSBgVGFiUGFuZWxgLlxuXHQqL1xuXHRzaG91bGRSZW5kZXIoKSB7XG5cdFx0cmV0dXJuIHRoaXMuYWN0aXZlIHx8IHRoaXMuY2FjaGVBY3RpdmU7XG5cdH1cblxuXHRwdWJsaWMgaXNUZW1wbGF0ZSh2YWx1ZSkge1xuXHRcdHJldHVybiB2YWx1ZSBpbnN0YW5jZW9mIFRlbXBsYXRlUmVmO1xuXHR9XG59XG4iXX0=