placer-toolkit 0.5.1

package/dist/components/comparer/comparer.component.d.ts

@@ -0,0 +1,43 @@
+import { LitElement } from "lit";
+import type { CSSResultGroup } from "lit";
+import { PcIcon } from "../icon/icon.js";
+/**
+ * @summary Compare visual differences between similar content with a sliding panel.
+ * @status experimental
+ * @since 0.5.1
+ *
+ * @dependency pc-icon
+ *
+ * @slot before — The before content, often an `<img>` or `<svg>` element.
+ * @slot after — The after content, often an `<img>` or `<svg>` element.
+ * @slot handle — The icon used inside the handle.
+ *
+ * @event pc-change — Emitted when the position of the handle changes.
+ *
+ * @csspart base — The component’s base wrapper.
+ * @csspart before — The container that wraps the before content.
+ * @csspart after — The container that wraps the after content.
+ * @csspart divider — The divider that separates both sides.
+ * @csspart handle — The handle that the user drags to expose the after content.
+ *
+ * @cssproperty --divider-width — The width of the dividing line.
+ * @cssproperty --handle-size — The size of the compare handle.
+ */
+export declare class PcComparer extends LitElement {
+    static styles: CSSResultGroup;
+    /** @internal This is an internal property. */
+    static scopedElement: {
+        "pc-icon": typeof PcIcon;
+    };
+    /** @internal This is an internal property. */
+    base: HTMLElement;
+    /** @internal This is an internal property. */
+    handle: HTMLElement;
+    /** The position of the divider as a percentage. */
+    position: number;
+    private handleDrag;
+    private handleKeyDown;
+    /** @internal This is an internal property. */
+    handlePositionChange(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/components/comparer/comparer.component.js

@@ -0,0 +1,181 @@
+import { __decorate, __metadata } from 'tslib';
+import { LitElement, html } from 'lit';
+import { query, property, customElement } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { styleMap } from 'lit/directives/style-map.js';
+import { clamp } from '../../internal/math.js';
+import { drag } from '../../internal/drag.js';
+import { watch } from '../../internal/watch.js';
+import { emit } from '../../internal/emit.js';
+import { PcIcon } from '../icon/icon.component.js';
+import { styles } from './comparer.styles.js';
+
+/**
+ * @summary Compare visual differences between similar content with a sliding panel.
+ * @status experimental
+ * @since 0.5.1
+ *
+ * @dependency pc-icon
+ *
+ * @slot before — The before content, often an `<img>` or `<svg>` element.
+ * @slot after — The after content, often an `<img>` or `<svg>` element.
+ * @slot handle — The icon used inside the handle.
+ *
+ * @event pc-change — Emitted when the position of the handle changes.
+ *
+ * @csspart base — The component’s base wrapper.
+ * @csspart before — The container that wraps the before content.
+ * @csspart after — The container that wraps the after content.
+ * @csspart divider — The divider that separates both sides.
+ * @csspart handle — The handle that the user drags to expose the after content.
+ *
+ * @cssproperty --divider-width — The width of the dividing line.
+ * @cssproperty --handle-size — The size of the compare handle.
+ */
+let PcComparer = class PcComparer extends LitElement {
+    constructor() {
+        super(...arguments);
+        /** The position of the divider as a percentage. */
+        this.position = 50;
+    }
+    handleDrag(event) {
+        const { width } = this.base.getBoundingClientRect();
+        const isRTL = document.documentElement.dir === "rtl" ||
+            (!document.documentElement.dir &&
+                getComputedStyle(document.documentElement).direction === "rtl");
+        event.preventDefault();
+        drag(this.base, {
+            onMove: (x) => {
+                this.position = parseFloat(clamp((x / width) * 100, 0, 100).toFixed(2));
+                if (isRTL) {
+                    this.position = 100 - this.position;
+                }
+            },
+            initialEvent: event,
+        });
+    }
+    handleKeyDown(event) {
+        const isLTR = document.documentElement.dir === "ltr" ||
+            (document.documentElement.dir === "" &&
+                getComputedStyle(document.documentElement).direction === "ltr");
+        const isRTL = document.documentElement.dir === "rtl" ||
+            (!document.documentElement.dir &&
+                getComputedStyle(document.documentElement).direction === "rtl");
+        if (["ArrowLeft", "ArrowRight", "Home", "End"].includes(event.key)) {
+            const increment = event.shiftKey ? 10 : 1;
+            let newPosition = this.position;
+            event.preventDefault();
+            if ((isLTR && event.key === "ArrowLeft") ||
+                (isRTL && event.key === "ArrowRight")) {
+                newPosition -= increment;
+            }
+            if ((isLTR && event.key === "ArrowRight") ||
+                (isRTL && event.key === "ArrowLeft")) {
+                newPosition += increment;
+            }
+            if (event.key === "Home") {
+                newPosition = 0;
+            }
+            if (event.key === "End") {
+                newPosition = 100;
+            }
+            newPosition = clamp(newPosition, 0, 100);
+            this.position = newPosition;
+        }
+    }
+    /** @internal This is an internal property. */
+    handlePositionChange() {
+        emit(this, "pc-change");
+    }
+    render() {
+        const isRTL = document.documentElement.dir === "rtl" ||
+            (!document.documentElement.dir &&
+                getComputedStyle(document.documentElement).direction === "rtl");
+        return html `
+            <div
+                part="base"
+                class=${classMap({
+            "comparer": true,
+            "comparer-rtl": isRTL === true,
+        })}
+                id="comparer"
+                @keydown=${this.handleKeyDown}
+            >
+                <div class="comparer-content">
+                    <div part="before" class="comparer-before-content">
+                        <slot name="before"></slot>
+                    </div>
+
+                    <div
+                        part="after"
+                        class="comparer-after-content"
+                        style=${styleMap({
+            clipPath: isRTL
+                ? `inset(0 0 0 ${100 - this.position}%)`
+                : `inset(0 ${100 - this.position}% 0 0)`,
+        })}
+                    >
+                        <slot name="after"></slot>
+                    </div>
+                </div>
+
+                <div
+                    part="divider"
+                    class="comparer-divider"
+                    style=${styleMap({
+            left: isRTL
+                ? `${100 - this.position}%`
+                : `${this.position}%`,
+        })}
+                    @mousedown=${this.handleDrag}
+                    @touchstart=${this.handleDrag}
+                >
+                    <div
+                        part="handle"
+                        class="comparer-handle"
+                        role="scrollbar"
+                        aria-valuenow=${this.position}
+                        aria-valuemin="0"
+                        aria-valuemax="100"
+                        aria-controls="comparer"
+                        tabindex="0"
+                    >
+                        <slot name="handle">
+                            <pc-icon
+                                library="system"
+                                icon-style="solid"
+                                name="grip-vertical"
+                            ></pc-icon>
+                        </slot>
+                    </div>
+                </div>
+            </div>
+        `;
+    }
+};
+PcComparer.styles = styles;
+/** @internal This is an internal property. */
+PcComparer.scopedElement = { "pc-icon": PcIcon };
+__decorate([
+    query(".comparer"),
+    __metadata("design:type", HTMLElement)
+], PcComparer.prototype, "base", void 0);
+__decorate([
+    query(".comparer-handle"),
+    __metadata("design:type", HTMLElement)
+], PcComparer.prototype, "handle", void 0);
+__decorate([
+    property({ type: Number, reflect: true }),
+    __metadata("design:type", Object)
+], PcComparer.prototype, "position", void 0);
+__decorate([
+    watch("position", { waitUntilFirstUpdate: true }),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], PcComparer.prototype, "handlePositionChange", null);
+PcComparer = __decorate([
+    customElement("pc-comparer")
+], PcComparer);
+
+export { PcComparer };

package/dist/components/comparer/comparer.d.ts

@@ -0,0 +1,8 @@
+import { PcComparer } from "./comparer.component.js";
+export * from "./comparer.component.js";
+export default PcComparer;
+declare global {
+    interface HTMLElementTagNameMap {
+        "pc-comparer": PcComparer;
+    }
+}

package/dist/components/comparer/comparer.js

@@ -0,0 +1,5 @@
+import { PcComparer as PcComparer$1 } from './comparer.component.js';
+
+var PcComparer = PcComparer$1;
+
+export { PcComparer$1 as PcComparer, PcComparer as default };

package/dist/components/comparer/comparer.styles.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("lit").CSSResult;

package/dist/components/comparer/comparer.styles.js

@@ -0,0 +1,75 @@
+import { css } from 'lit';
+
+const styles = css `
+    :host {
+        --divider-width: 2px;
+        --handle-size: 2.5rem;
+        display: inline-block;
+        position: relative;
+    }
+
+    .comparer {
+        max-width: 100%;
+        max-height: 100%;
+        overflow: hidden;
+    }
+
+    .comparer-before-content,
+    .comparer-after-content {
+        display: block;
+        pointer-events: none;
+    }
+
+    .comparer-before-content ::slotted(*),
+    .comparer-after-content ::slotted(*) {
+        display: block;
+        max-width: 100% !important;
+        height: auto;
+        border-radius: var(--pc-border-radius-m);
+    }
+
+    .comparer-after-content {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+    }
+
+    .comparer-divider {
+        display: flex;
+        position: absolute;
+        align-items: center;
+        justify-content: center;
+        top: 0;
+        width: var(--divider-width);
+        height: 100%;
+        background-color: var(--pc-color-neutral-0);
+        translate: calc(var(--divider-width) / -2);
+        cursor: ew-resize;
+    }
+
+    .comparer-handle {
+        display: flex;
+        position: absolute;
+        align-items: center;
+        justify-content: center;
+        top: calc(50% - (var(--handle-size) / 2));
+        width: var(--handle-size);
+        height: var(--handle-size);
+        background-color: var(--pc-color-neutral-0);
+        border-radius: var(--pc-border-radius-circle);
+        font-size: calc(var(--handle-size) * 0.5);
+        color: var(--pc-color-neutral-700);
+        cursor: inherit;
+        z-index: 10;
+        transition: outline var(--pc-transition-fast) ease-in-out;
+    }
+
+    .comparer-handle:focus-visible {
+        outline: var(--pc-focus-ring);
+        outline-offset: var(--pc-focus-ring);
+    }
+`;
+
+export { styles };

package/dist/components/copy-button/copy-button.component.d.ts

@@ -0,0 +1,75 @@
+import { LitElement } from "lit";
+import type { CSSResultGroup } from "lit";
+import { PcIcon } from "../icon/icon.js";
+import { PcTooltip } from "../tooltip/tooltip.js";
+/**
+ * @summary Copies text data to the clipboard when the user clicks the trigger.
+ * @status experimental
+ * @since 0.5.1
+ *
+ * @dependency pc-icon
+ * @dependency pc-tooltip
+ *
+ * @slot copy-icon — The icon to show in the default copy state. Works best with `<pc-icon>`.
+ * @slot success-icon — The icon to show when the content is copied. Works best with `<pc-icon>`.
+ * @slot error-icon — The icon to show when a copy error occurs. Works best with `<pc-icon>`.
+ *
+ * @event pc-copy — Emitted when the data has been copied.
+ * @event pc-error — Emitted when the data could not be copied.
+ *
+ * @csspart button — The internal `<button>` element.
+ * @csspart copy-icon — The container that holds the copy icon.
+ * @csspart success-icon — The container that holds the success icon.
+ * @csspart error-icon — The container that holds the error icon.
+ * @csspart tooltip__base — The tooltip’s `base` part.
+ * @csspart tooltip__base__popup — The tooltip’s `popup` part.
+ * @csspart tooltip__base__arrow — The tooltip’s `arrow` part.
+ * @csspart tooltip__body — The tooltip’s `body` part.
+ *
+ * @cssproperty --success-color — The colour to use for success feedback.
+ * @cssproperty --error-color — The colour to use for error feedback.
+ *
+ * @animation copy.in — The animation to use when the icons animate in.
+ * @animation copy.out — The animation to use when the icons animate out.
+ */
+export declare class PcCopyButton extends LitElement {
+    static styles: CSSResultGroup;
+    /** @internal This is an internal property. */
+    static dependencies: {
+        "pc-icon": typeof PcIcon;
+        "pc-tooltip": typeof PcTooltip;
+    };
+    /** @internal This is an internal property. */
+    copyIcon: HTMLSlotElement;
+    /** @internal This is an internal property. */
+    successIcon: HTMLSlotElement;
+    /** @internal This is an internal property. */
+    errorIcon: HTMLSlotElement;
+    /** @internal This is an internal property. */
+    tooltip: PcTooltip;
+    /** @internal This is an internal property. */
+    isCopying: boolean;
+    /** @internal This is an internal property. */
+    status: "rest" | "success" | "error";
+    /** The text value to copy. */
+    value: string;
+    /**An id that references an element in the same document from which data will be copied. If both this and `value` are present, this value will take precedence. By default, the target element’s `textContent` will be copied. To copy an attribute, append the attribute name wrapped in square brackets (e.g., `from="element[value]"`). To copy a property, append a dot and the property name (e.g., `from="element.value"`). */
+    from: string;
+    /** Disables the copy button. */
+    disabled: boolean;
+    /** A custom label to show in the tooltip. */
+    copyLabel: string;
+    /** A custom label to show in the tooltip after copying. */
+    successLabel: string;
+    /** A custom label to show in the tooltip when a copy error occurs. */
+    errorLabel: string;
+    /** The length of time to show feedback before restoring the default trigger. */
+    feedbackDuration: number;
+    /** The preferred placement of the tooltip. */
+    tooltipPlacement: "top" | "right" | "bottom" | "left";
+    /** Enable this option to prevent the tooltip from being clipped when the component is placed inside a container with `overflow: auto|hidden|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all situations. */
+    hoist: boolean;
+    private handleCopy;
+    private showStatus;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/components/copy-button/copy-button.component.js

@@ -0,0 +1,289 @@
+import { __decorate, __metadata } from 'tslib';
+import { LitElement, html } from 'lit';
+import { query, state, property, customElement } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { setDefaultAnimation, getAnimation } from '../../utilities/animation-registry.js';
+import { emit } from '../../internal/emit.js';
+import { PcIcon } from '../icon/icon.component.js';
+import { PcTooltip } from '../tooltip/tooltip.component.js';
+import { styles } from './copy-button.styles.js';
+
+setDefaultAnimation("copy.in", {
+    keyframes: [
+        { scale: "0.6", opacity: "0" },
+        { scale: "1.1", opacity: "1" },
+        { scale: "0.95", opacity: "1" },
+        { scale: "1", opacity: "1" },
+    ],
+    options: {
+        duration: 350,
+        easing: "cubic-bezier(0.34, 1.56, 0.64, 1)",
+    },
+});
+setDefaultAnimation("copy.out", {
+    keyframes: [
+        { scale: "1", opacity: "1" },
+        { scale: "0.85", opacity: "0" },
+    ],
+    options: {
+        duration: 200,
+        easing: "cubic-bezier(0.75, 0, 0.9, 0.05)",
+    },
+});
+/**
+ * @summary Copies text data to the clipboard when the user clicks the trigger.
+ * @status experimental
+ * @since 0.5.1
+ *
+ * @dependency pc-icon
+ * @dependency pc-tooltip
+ *
+ * @slot copy-icon — The icon to show in the default copy state. Works best with `<pc-icon>`.
+ * @slot success-icon — The icon to show when the content is copied. Works best with `<pc-icon>`.
+ * @slot error-icon — The icon to show when a copy error occurs. Works best with `<pc-icon>`.
+ *
+ * @event pc-copy — Emitted when the data has been copied.
+ * @event pc-error — Emitted when the data could not be copied.
+ *
+ * @csspart button — The internal `<button>` element.
+ * @csspart copy-icon — The container that holds the copy icon.
+ * @csspart success-icon — The container that holds the success icon.
+ * @csspart error-icon — The container that holds the error icon.
+ * @csspart tooltip__base — The tooltip’s `base` part.
+ * @csspart tooltip__base__popup — The tooltip’s `popup` part.
+ * @csspart tooltip__base__arrow — The tooltip’s `arrow` part.
+ * @csspart tooltip__body — The tooltip’s `body` part.
+ *
+ * @cssproperty --success-color — The colour to use for success feedback.
+ * @cssproperty --error-color — The colour to use for error feedback.
+ *
+ * @animation copy.in — The animation to use when the icons animate in.
+ * @animation copy.out — The animation to use when the icons animate out.
+ */
+let PcCopyButton = class PcCopyButton extends LitElement {
+    constructor() {
+        super(...arguments);
+        /** @internal This is an internal property. */
+        this.isCopying = false;
+        /** @internal This is an internal property. */
+        this.status = "rest";
+        /** The text value to copy. */
+        this.value = "";
+        /**An id that references an element in the same document from which data will be copied. If both this and `value` are present, this value will take precedence. By default, the target element’s `textContent` will be copied. To copy an attribute, append the attribute name wrapped in square brackets (e.g., `from="element[value]"`). To copy a property, append a dot and the property name (e.g., `from="element.value"`). */
+        this.from = "";
+        /** Disables the copy button. */
+        this.disabled = false;
+        /** A custom label to show in the tooltip. */
+        this.copyLabel = "";
+        /** A custom label to show in the tooltip after copying. */
+        this.successLabel = "";
+        /** A custom label to show in the tooltip when a copy error occurs. */
+        this.errorLabel = "";
+        /** The length of time to show feedback before restoring the default trigger. */
+        this.feedbackDuration = 1000;
+        /** The preferred placement of the tooltip. */
+        this.tooltipPlacement = "top";
+        /** Enable this option to prevent the tooltip from being clipped when the component is placed inside a container with `overflow: auto|hidden|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all situations. */
+        this.hoist = false;
+    }
+    async handleCopy() {
+        if (this.disabled || this.isCopying) {
+            return;
+        }
+        this.isCopying = true;
+        let valueToCopy = this.value;
+        if (this.from) {
+            const root = this.getRootNode();
+            const isProperty = this.from.includes(".");
+            const isAttribute = this.from.includes("[") && this.from.includes("]");
+            let id = this.from;
+            let field = "";
+            if (isProperty) {
+                [id, field] = this.from.trim().split(".");
+            }
+            else if (isAttribute) {
+                [id, field] = this.from.trim().replace(/\]$/, "").split("[");
+            }
+            const target = "getElementById" in root ? root.getElementById(id) : null;
+            if (target) {
+                if (isAttribute) {
+                    valueToCopy = target.getAttribute(field) || "";
+                }
+                else if (isProperty) {
+                    // @ts-expect-error — Accessing a property with dynamic types
+                    valueToCopy = target[field] || "";
+                }
+                else {
+                    valueToCopy = target.textContent || "";
+                }
+            }
+            else {
+                this.showStatus("error");
+                emit(this, "pc-error");
+            }
+        }
+        if (!valueToCopy) {
+            this.showStatus("error");
+            emit(this, "pc-error");
+        }
+        else {
+            try {
+                await navigator.clipboard.writeText(valueToCopy);
+                this.showStatus("success");
+                emit(this, "pc-copy", {
+                    detail: {
+                        value: valueToCopy,
+                    },
+                });
+            }
+            catch {
+                this.showStatus("error");
+                emit(this, "pc-error");
+            }
+        }
+    }
+    async showStatus(status) {
+        const copyLabel = this.copyLabel || "Copy";
+        const successLabel = this.successLabel || "Copied!";
+        const errorLabel = this.errorLabel || "Error";
+        const iconToShow = status === "success" ? this.successIcon : this.errorIcon;
+        const showAnimation = getAnimation(this, "copy.in", { dir: "ltr" });
+        const hideAnimation = getAnimation(this, "copy.out", { dir: "ltr" });
+        this.tooltip.content = status === "success" ? successLabel : errorLabel;
+        await this.copyIcon.animate(hideAnimation.keyframes, hideAnimation.options).finished;
+        this.copyIcon.hidden = true;
+        this.status = status;
+        iconToShow.hidden = false;
+        await iconToShow.animate(showAnimation.keyframes, showAnimation.options)
+            .finished;
+        setTimeout(async () => {
+            await iconToShow.animate(hideAnimation.keyframes, hideAnimation.options).finished;
+            iconToShow.hidden = true;
+            this.status = "rest";
+            this.copyIcon.hidden = false;
+            await this.copyIcon.animate(showAnimation.keyframes, showAnimation.options).finished;
+            this.tooltip.content = copyLabel;
+            this.isCopying = false;
+        }, this.feedbackDuration);
+    }
+    render() {
+        const copyLabel = this.copyLabel || "Copy";
+        return html `
+            <pc-tooltip
+                class=${classMap({
+            "copy-button-container": true,
+            "copy-button-success": this.status === "success",
+            "copy-button-error": this.status === "error",
+        })}
+                content=${copyLabel}
+                placement=${this.tooltipPlacement}
+                ?disabled=${this.disabled}
+                ?hoist=${this.hoist}
+                exportparts="
+                    base:tooltip__base,
+                    base-popup:tooltip__base__popup,
+                    base-arrow:tooltip__base__arrow,
+                    body:tooltip__body
+                "
+            >
+                <button
+                    class="copy-button"
+                    type="button"
+                    part="button"
+                    ?disabled=${this.disabled}
+                    @click=${this.handleCopy}
+                >
+                    <slot part="copy-icon" name="copy-icon">
+                        <pc-icon
+                            library="system"
+                            icon-style="regular"
+                            name="copy"
+                        ></pc-icon>
+                    </slot>
+                    <slot part="success-icon" name="success-icon" hidden>
+                        <pc-icon
+                            library="system"
+                            icon-style="solid"
+                            name="check"
+                        ></pc-icon>
+                    </slot>
+                    <slot part="error-icon" name="error-icon" hidden>
+                        <pc-icon
+                            library="system"
+                            icon-style="solid"
+                            name="xmark"
+                        ></pc-icon>
+                    </slot>
+                </button>
+            </pc-tooltip>
+        `;
+    }
+};
+PcCopyButton.styles = styles;
+/** @internal This is an internal property. */
+PcCopyButton.dependencies = { "pc-icon": PcIcon, "pc-tooltip": PcTooltip };
+__decorate([
+    query('slot[name="copy-icon"]'),
+    __metadata("design:type", HTMLSlotElement)
+], PcCopyButton.prototype, "copyIcon", void 0);
+__decorate([
+    query('slot[name="success-icon"]'),
+    __metadata("design:type", HTMLSlotElement)
+], PcCopyButton.prototype, "successIcon", void 0);
+__decorate([
+    query('slot[name="error-icon"]'),
+    __metadata("design:type", HTMLSlotElement)
+], PcCopyButton.prototype, "errorIcon", void 0);
+__decorate([
+    query("pc-tooltip"),
+    __metadata("design:type", PcTooltip)
+], PcCopyButton.prototype, "tooltip", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], PcCopyButton.prototype, "isCopying", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", String)
+], PcCopyButton.prototype, "status", void 0);
+__decorate([
+    property(),
+    __metadata("design:type", Object)
+], PcCopyButton.prototype, "value", void 0);
+__decorate([
+    property(),
+    __metadata("design:type", Object)
+], PcCopyButton.prototype, "from", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true }),
+    __metadata("design:type", Object)
+], PcCopyButton.prototype, "disabled", void 0);
+__decorate([
+    property({ attribute: "copy-label" }),
+    __metadata("design:type", Object)
+], PcCopyButton.prototype, "copyLabel", void 0);
+__decorate([
+    property({ attribute: "success-label" }),
+    __metadata("design:type", Object)
+], PcCopyButton.prototype, "successLabel", void 0);
+__decorate([
+    property({ attribute: "error-label" }),
+    __metadata("design:type", Object)
+], PcCopyButton.prototype, "errorLabel", void 0);
+__decorate([
+    property({ attribute: "feedback-duration", type: Number }),
+    __metadata("design:type", Object)
+], PcCopyButton.prototype, "feedbackDuration", void 0);
+__decorate([
+    property({ attribute: "tooltip-placement" }),
+    __metadata("design:type", String)
+], PcCopyButton.prototype, "tooltipPlacement", void 0);
+__decorate([
+    property({ type: Boolean }),
+    __metadata("design:type", Object)
+], PcCopyButton.prototype, "hoist", void 0);
+PcCopyButton = __decorate([
+    customElement("pc-copy-button")
+], PcCopyButton);
+
+export { PcCopyButton };