import * as i0 from '@angular/core';
import { Component, Input, NgModule } from '@angular/core';
import { BehaviorSubject, interval } from 'rxjs';
import { first } from 'rxjs/operators';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i2 from '@aztrix/icons';
import { IconsModule } from '@aztrix/icons';
import * as i3 from '@aztrix/components/button';
import { ButtonModule } from '@aztrix/components/button';
import * as i4 from '@angular/cdk/clipboard';
import { ClipboardModule } from '@angular/cdk/clipboard';
import { v4 } from 'uuid';
import * as i2$1 from '@angular/cdk/text-field';
import * as i3$1 from '@angular/material/legacy-form-field';
import * as i4$1 from '@angular/material/legacy-input';
import { MatLegacyInputModule } from '@angular/material/legacy-input';
import * as i6 from '@aztrix/helpers';
import { HelperPipesModule } from '@aztrix/helpers';

class CopyButtonComponent {
    constructor() {
        this.color = 'grey';
        this.copied$ = new BehaviorSubject(false);
    }
    didClickCopy() {
        this.copied$.next(true);
        interval(5000)
            .pipe(first())
            .subscribe(() => {
            this.copied$.next(false);
        });
    }
}
CopyButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: CopyButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
CopyButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: CopyButtonComponent, selector: "ax-copy-button", inputs: { value: "value", color: "color" }, ngImport: i0, template: "<button\n  axButton\n  icon-button\n  [cdkCopyToClipboard]=\"value\"\n  (cdkCopyToClipboardCopied)=\"didClickCopy()\"\n  [color]=\"color === 'grey' ? undefined : 'white'\"\n>\n  <ax-icon\n    class=\"icon\"\n    [ngClass]=\"{copied: copied$ | async, white: color === 'white'}\"\n    [name]=\"(copied$ | async) ? 'check-circle' : 'content-copy'\"\n  ></ax-icon>\n</button>\n", styles: [":host{display:block}.input{overflow:hidden;color:#555;margin:0;padding:0}.hidden{display:inline;position:relative;font-size:1rem}.hidden .text{display:inline-flex;width:100%;overflow:hidden;padding-left:.25rem;filter:blur(3px)}.show{position:absolute;left:50%;transform:translate(-50%);background-color:#fff;box-shadow:0 0 5px 10px #fff}.copied{color:var(--primary-color-500)}.copied.white{color:#fff}.code{display:grid;grid-template-columns:1fr 34px;background-color:#efefef;padding:1rem}.code>code{min-width:0}.code pre{white-space:pre-wrap;word-break:break-word;margin:0}@keyframes slide-in{to{margin-left:1rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.IconComponent, selector: "ax-icon", inputs: ["name", "inline"] }, { kind: "directive", type: i3.ButtonDirective, selector: "[axButton]", inputs: ["color", "labelHideMobile", "smallButton", "bigButton", "fullWidth", "filled", "outline", "icon-button", "hoverLabel", "hover", "lowercase", "disabled"] }, { kind: "directive", type: i4.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: CopyButtonComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ax-copy-button', template: "<button\n  axButton\n  icon-button\n  [cdkCopyToClipboard]=\"value\"\n  (cdkCopyToClipboardCopied)=\"didClickCopy()\"\n  [color]=\"color === 'grey' ? undefined : 'white'\"\n>\n  <ax-icon\n    class=\"icon\"\n    [ngClass]=\"{copied: copied$ | async, white: color === 'white'}\"\n    [name]=\"(copied$ | async) ? 'check-circle' : 'content-copy'\"\n  ></ax-icon>\n</button>\n", styles: [":host{display:block}.input{overflow:hidden;color:#555;margin:0;padding:0}.hidden{display:inline;position:relative;font-size:1rem}.hidden .text{display:inline-flex;width:100%;overflow:hidden;padding-left:.25rem;filter:blur(3px)}.show{position:absolute;left:50%;transform:translate(-50%);background-color:#fff;box-shadow:0 0 5px 10px #fff}.copied{color:var(--primary-color-500)}.copied.white{color:#fff}.code{display:grid;grid-template-columns:1fr 34px;background-color:#efefef;padding:1rem}.code>code{min-width:0}.code pre{white-space:pre-wrap;word-break:break-word;margin:0}@keyframes slide-in{to{margin-left:1rem}}\n"] }]
        }], propDecorators: { value: [{
                type: Input
            }], color: [{
                type: Input
            }] } });

class CopyTextComponent {
    constructor() {
        this.secret = false;
        this.code = false;
        this.appearance = 'standard';
        this.copied$ = new BehaviorSubject(false);
        this.fakeValue = this._generateRandomFakeValue();
    }
    didClickCopy() {
        this.copied$.next(true);
        interval(5000)
            .pipe(first())
            .subscribe(() => {
            this.copied$.next(false);
        });
    }
    _generateRandomFakeValue() {
        return v4() + v4() + v4();
    }
}
CopyTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: CopyTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
CopyTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: CopyTextComponent, selector: "ax-copy-text", inputs: { value: "value", secret: "secret", code: "code", appearance: "appearance" }, ngImport: i0, template: "<ng-template #secretValue>\n  <div class=\"hidden\" *ngIf=\"secret\" (click)=\"secret = !secret\">\n    <span class=\"text\">{{ fakeValue }}</span>\n    <span class=\"show\">{{ 'label.show' | translate | lowercase }}</span>\n  </div>\n</ng-template>\n\n<mat-form-field\n  *ngIf=\"!code\"\n  class=\"c-input remove-subtext\"\n  [appearance]=\"appearance\"\n  style=\"width: 100%\"\n>\n  <textarea\n    [hidden]=\"secret\"\n    class=\"input\"\n    matInput\n    cdkTextareaAutosize\n    cdkAutosizeMinRows=\"1\"\n    disabled\n    [value]=\"secret ? '' : value\"\n  ></textarea>\n  <ng-container *ngTemplateOutlet=\"secretValue\"></ng-container>\n  <ax-copy-button matSuffix [value]=\"value\"></ax-copy-button>\n</mat-form-field>\n\n<div class=\"code\" *ngIf=\"code\">\n  <code *ngIf=\"!secret\">\n    <pre>{{ value }}</pre>\n  </code>\n  <ng-container *ngTemplateOutlet=\"secretValue\"></ng-container>\n  <ax-copy-button [value]=\"value\"></ax-copy-button>\n</div>\n", styles: [":host{display:block;width:100%}.input{overflow:hidden;color:#555;margin:0;padding:0}.hidden{display:inline;position:relative;font-size:1rem}.hidden .text{display:inline-flex;width:100%;overflow:hidden;padding-left:.25rem;filter:blur(3px);white-space:nowrap}.show{position:absolute;left:50%;transform:translate(-50%);background-color:#fff;box-shadow:0 0 5px 10px #fff}.copied{color:var(--primary-color-500)}.code{display:grid;grid-template-columns:1fr 34px;background-color:#efefef;padding:1rem}.code>code{min-width:0}.code pre{white-space:pre-wrap;word-break:break-word;margin:0}@keyframes slide-in{to{margin-left:1rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: i3$1.MatLegacyFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLegacySuffix, selector: "[matSuffix]" }, { kind: "directive", type: i4$1.MatLegacyInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", exportAs: ["matInput"] }, { kind: "component", type: CopyButtonComponent, selector: "ax-copy-button", inputs: ["value", "color"] }, { kind: "pipe", type: i1.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: CopyTextComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ax-copy-text', template: "<ng-template #secretValue>\n  <div class=\"hidden\" *ngIf=\"secret\" (click)=\"secret = !secret\">\n    <span class=\"text\">{{ fakeValue }}</span>\n    <span class=\"show\">{{ 'label.show' | translate | lowercase }}</span>\n  </div>\n</ng-template>\n\n<mat-form-field\n  *ngIf=\"!code\"\n  class=\"c-input remove-subtext\"\n  [appearance]=\"appearance\"\n  style=\"width: 100%\"\n>\n  <textarea\n    [hidden]=\"secret\"\n    class=\"input\"\n    matInput\n    cdkTextareaAutosize\n    cdkAutosizeMinRows=\"1\"\n    disabled\n    [value]=\"secret ? '' : value\"\n  ></textarea>\n  <ng-container *ngTemplateOutlet=\"secretValue\"></ng-container>\n  <ax-copy-button matSuffix [value]=\"value\"></ax-copy-button>\n</mat-form-field>\n\n<div class=\"code\" *ngIf=\"code\">\n  <code *ngIf=\"!secret\">\n    <pre>{{ value }}</pre>\n  </code>\n  <ng-container *ngTemplateOutlet=\"secretValue\"></ng-container>\n  <ax-copy-button [value]=\"value\"></ax-copy-button>\n</div>\n", styles: [":host{display:block;width:100%}.input{overflow:hidden;color:#555;margin:0;padding:0}.hidden{display:inline;position:relative;font-size:1rem}.hidden .text{display:inline-flex;width:100%;overflow:hidden;padding-left:.25rem;filter:blur(3px);white-space:nowrap}.show{position:absolute;left:50%;transform:translate(-50%);background-color:#fff;box-shadow:0 0 5px 10px #fff}.copied{color:var(--primary-color-500)}.code{display:grid;grid-template-columns:1fr 34px;background-color:#efefef;padding:1rem}.code>code{min-width:0}.code pre{white-space:pre-wrap;word-break:break-word;margin:0}@keyframes slide-in{to{margin-left:1rem}}\n"] }]
        }], propDecorators: { value: [{
                type: Input
            }], secret: [{
                type: Input
            }], code: [{
                type: Input
            }], appearance: [{
                type: Input
            }] } });

class CopyTextModule {
}
CopyTextModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: CopyTextModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
CopyTextModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.5", ngImport: i0, type: CopyTextModule, declarations: [CopyTextComponent, CopyButtonComponent], imports: [CommonModule,
        MatLegacyInputModule,
        IconsModule,
        ButtonModule,
        HelperPipesModule,
        ClipboardModule], exports: [CopyTextComponent, CopyButtonComponent] });
CopyTextModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: CopyTextModule, imports: [CommonModule,
        MatLegacyInputModule,
        IconsModule,
        ButtonModule,
        HelperPipesModule,
        ClipboardModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: CopyTextModule, decorators: [{
            type: NgModule,
            args: [{
                    declarations: [CopyTextComponent, CopyButtonComponent],
                    imports: [
                        CommonModule,
                        MatLegacyInputModule,
                        IconsModule,
                        ButtonModule,
                        HelperPipesModule,
                        ClipboardModule,
                    ],
                    exports: [CopyTextComponent, CopyButtonComponent],
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { CopyButtonComponent, CopyTextComponent, CopyTextModule };
//# sourceMappingURL=aztrix-components-copy-text.mjs.map
//# sourceMappingURL=aztrix-components-copy-text.mjs.map
