const smCopy=document.createElement("template");smCopy.innerHTML='\n<style>     \n*{\n    padding: 0;\n    margin: 0;\n    -webkit-box-sizing: border-box;\n            box-sizing: border-box;\n}       \n:host{\n    display: -webkit-box;\n    display: flex;\n    --padding: 0;\n    --button-background-color: rgba(var(--text-color, (17,17,17)), 0.2);\n}\n.copy{\n    display: grid;\n    gap: 0.5rem;\n    padding: var(--padding);\n    align-items: center;\n    grid-template-columns: minmax(0, 1fr) auto;\n}\n:host(:not([clip-text])) .copy-content{\n    overflow-wrap: break-word;\n    word-wrap: break-word;\n}\n:host([clip-text]) .copy-content{\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n.copy-button{\n    display: inline-flex;\n    justify-content: center;\n    cursor: pointer;\n    border: none;\n    padding: 0.4rem;\n    background-color: rgba(var(--text-color, (17,17,17)), 0.06);\n    border-radius: var(--button-border-radius, 0.3rem);\n    transition: background-color 0.2s;\n    font-family: inherit;\n    color: inherit;\n    font-size: 0.7rem;\n    font-weight: 500;\n    text-transform: uppercase;\n    letter-spacing: 0.05rem;\n}\n.copy-button:active{\n    background-color: var(--button-background-color);\n}\n@media (any-hover: hover){\n    .copy:hover .copy-button{\n        opacity: 1;\n    }\n    .copy-button:hover{\n        background-color: var(--button-background-color);\n    }\n}\n</style>\n<section class="copy">\n    <p class="copy-content">\n        <slot></slot>\n    </p>\n    <button part="button" class="copy-button" title="copy">\n        <slot name="copy-icon">\n        COPY\n        </slot>\n    </button>\n</section>\n',customElements.define("sm-copy",class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}).append(smCopy.content.cloneNode(!0)),this.copyContent=this.shadowRoot.querySelector(".copy-content"),this.copyButton=this.shadowRoot.querySelector(".copy-button"),this.copy=this.copy.bind(this)}static get observedAttributes(){return["value"]}set value(val){this.setAttribute("value",val)}get value(){return this.getAttribute("value")}fireEvent(){this.dispatchEvent(new CustomEvent("copy",{composed:!0,bubbles:!0,cancelable:!0}))}copy(){navigator.clipboard.writeText(this.getAttribute("value")).then((res=>this.fireEvent())).catch((err=>console.error(err)))}connectedCallback(){this.copyButton.addEventListener("click",this.copy)}attributeChangedCallback(name,oldValue,newValue){if("value"===name){const slot=this.copyContent.querySelector("slot");if(!slot)return;const assignedNodes=slot.assignedNodes();assignedNodes&&assignedNodes.length||(slot.textContent=newValue)}}disconnectedCallback(){this.copyButton.removeEventListener("click",this.copy)}});