123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211 |
- import { DOCUMENT } from '@angular/common';
- import * as i0 from '@angular/core';
- import { inject, Injectable, InjectionToken, NgZone, EventEmitter, Directive, Input, Output, NgModule } from '@angular/core';
- /**
- * A pending copy-to-clipboard operation.
- *
- * The implementation of copying text to the clipboard modifies the DOM and
- * forces a re-layout. This re-layout can take too long if the string is large,
- * causing the execCommand('copy') to happen too long after the user clicked.
- * This results in the browser refusing to copy. This object lets the
- * re-layout happen in a separate tick from copying by providing a copy function
- * that can be called later.
- *
- * Destroy must be called when no longer in use, regardless of whether `copy` is
- * called.
- */
- class PendingCopy {
- _document;
- _textarea;
- constructor(text, _document) {
- this._document = _document;
- const textarea = (this._textarea = this._document.createElement('textarea'));
- const styles = textarea.style;
- // Hide the element for display and accessibility. Set a fixed position so the page layout
- // isn't affected. We use `fixed` with `top: 0`, because focus is moved into the textarea
- // for a split second and if it's off-screen, some browsers will attempt to scroll it into view.
- styles.position = 'fixed';
- styles.top = styles.opacity = '0';
- styles.left = '-999em';
- textarea.setAttribute('aria-hidden', 'true');
- textarea.value = text;
- // Making the textarea `readonly` prevents the screen from jumping on iOS Safari (see #25169).
- textarea.readOnly = true;
- // The element needs to be inserted into the fullscreen container, if the page
- // is in fullscreen mode, otherwise the browser won't execute the copy command.
- (this._document.fullscreenElement || this._document.body).appendChild(textarea);
- }
- /** Finishes copying the text. */
- copy() {
- const textarea = this._textarea;
- let successful = false;
- try {
- // Older browsers could throw if copy is not supported.
- if (textarea) {
- const currentFocus = this._document.activeElement;
- textarea.select();
- textarea.setSelectionRange(0, textarea.value.length);
- successful = this._document.execCommand('copy');
- if (currentFocus) {
- currentFocus.focus();
- }
- }
- }
- catch {
- // Discard error.
- // Initial setting of {@code successful} will represent failure here.
- }
- return successful;
- }
- /** Cleans up DOM changes used to perform the copy operation. */
- destroy() {
- const textarea = this._textarea;
- if (textarea) {
- textarea.remove();
- this._textarea = undefined;
- }
- }
- }
- /**
- * A service for copying text to the clipboard.
- */
- class Clipboard {
- _document = inject(DOCUMENT);
- constructor() { }
- /**
- * Copies the provided text into the user's clipboard.
- *
- * @param text The string to copy.
- * @returns Whether the operation was successful.
- */
- copy(text) {
- const pendingCopy = this.beginCopy(text);
- const successful = pendingCopy.copy();
- pendingCopy.destroy();
- return successful;
- }
- /**
- * Prepares a string to be copied later. This is useful for large strings
- * which take too long to successfully render and be copied in the same tick.
- *
- * The caller must call `destroy` on the returned `PendingCopy`.
- *
- * @param text The string to copy.
- * @returns the pending copy operation.
- */
- beginCopy(text) {
- return new PendingCopy(text, this._document);
- }
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Clipboard, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Clipboard, providedIn: 'root' });
- }
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Clipboard, decorators: [{
- type: Injectable,
- args: [{ providedIn: 'root' }]
- }], ctorParameters: () => [] });
- /** Injection token that can be used to provide the default options to `CdkCopyToClipboard`. */
- const CDK_COPY_TO_CLIPBOARD_CONFIG = new InjectionToken('CDK_COPY_TO_CLIPBOARD_CONFIG');
- /**
- * Provides behavior for a button that when clicked copies content into user's
- * clipboard.
- */
- class CdkCopyToClipboard {
- _clipboard = inject(Clipboard);
- _ngZone = inject(NgZone);
- /** Content to be copied. */
- text = '';
- /**
- * How many times to attempt to copy the text. This may be necessary for longer text, because
- * the browser needs time to fill an intermediate textarea element and copy the content.
- */
- attempts = 1;
- /**
- * Emits when some text is copied to the clipboard. The
- * emitted value indicates whether copying was successful.
- */
- copied = new EventEmitter();
- /** Copies that are currently being attempted. */
- _pending = new Set();
- /** Whether the directive has been destroyed. */
- _destroyed;
- /** Timeout for the current copy attempt. */
- _currentTimeout;
- constructor() {
- const config = inject(CDK_COPY_TO_CLIPBOARD_CONFIG, { optional: true });
- if (config && config.attempts != null) {
- this.attempts = config.attempts;
- }
- }
- /** Copies the current text to the clipboard. */
- copy(attempts = this.attempts) {
- if (attempts > 1) {
- let remainingAttempts = attempts;
- const pending = this._clipboard.beginCopy(this.text);
- this._pending.add(pending);
- const attempt = () => {
- const successful = pending.copy();
- if (!successful && --remainingAttempts && !this._destroyed) {
- // We use 1 for the timeout since it's more predictable when flushing in unit tests.
- this._currentTimeout = this._ngZone.runOutsideAngular(() => setTimeout(attempt, 1));
- }
- else {
- this._currentTimeout = null;
- this._pending.delete(pending);
- pending.destroy();
- this.copied.emit(successful);
- }
- };
- attempt();
- }
- else {
- this.copied.emit(this._clipboard.copy(this.text));
- }
- }
- ngOnDestroy() {
- if (this._currentTimeout) {
- clearTimeout(this._currentTimeout);
- }
- this._pending.forEach(copy => copy.destroy());
- this._pending.clear();
- this._destroyed = true;
- }
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CdkCopyToClipboard, deps: [], target: i0.ɵɵFactoryTarget.Directive });
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.6", type: CdkCopyToClipboard, isStandalone: true, selector: "[cdkCopyToClipboard]", inputs: { text: ["cdkCopyToClipboard", "text"], attempts: ["cdkCopyToClipboardAttempts", "attempts"] }, outputs: { copied: "cdkCopyToClipboardCopied" }, host: { listeners: { "click": "copy()" } }, ngImport: i0 });
- }
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CdkCopyToClipboard, decorators: [{
- type: Directive,
- args: [{
- selector: '[cdkCopyToClipboard]',
- host: {
- '(click)': 'copy()',
- },
- }]
- }], ctorParameters: () => [], propDecorators: { text: [{
- type: Input,
- args: ['cdkCopyToClipboard']
- }], attempts: [{
- type: Input,
- args: ['cdkCopyToClipboardAttempts']
- }], copied: [{
- type: Output,
- args: ['cdkCopyToClipboardCopied']
- }] } });
- class ClipboardModule {
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClipboardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.6", ngImport: i0, type: ClipboardModule, imports: [CdkCopyToClipboard], exports: [CdkCopyToClipboard] });
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClipboardModule });
- }
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClipboardModule, decorators: [{
- type: NgModule,
- args: [{
- imports: [CdkCopyToClipboard],
- exports: [CdkCopyToClipboard],
- }]
- }] });
- export { CDK_COPY_TO_CLIPBOARD_CONFIG, CdkCopyToClipboard, Clipboard, ClipboardModule, PendingCopy };
- //# sourceMappingURL=clipboard.mjs.map
|