clipxjs 1.1.2 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/clipx.min.js +2 -2
- package/package.json +1 -1
- package/src/clipx.js +3 -3
package/dist/clipx.min.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/*
|
|
2
2
|
ClipX JS
|
|
3
3
|
https://clipx.dzr.app
|
|
4
|
-
Version: 1.
|
|
4
|
+
Version: 1.2.0
|
|
5
5
|
Copyright (c) 2024 Mr Akshay Shinde
|
|
6
6
|
Licensed under the MIT license
|
|
7
7
|
*/
|
|
8
|
-
(function(t){function e(){this.attach=this.attach.bind(this),this.isProcessing=!1,this.disable={msg:!1,toast:!1},this.customStyles={}}e.prototype.copyText=function(t){if(navigator.clipboard)return navigator.clipboard.writeText(t);if(navigator.permissions)return navigator.permissions.query({name:"clipboard-write"}).then(function(e){if("granted"===e.state||"prompt"===e.state)return navigator.clipboard.writeText(t);throw new Error("Clipboard write permission denied.")});var e=document.createElement("textarea");return e.value=t,document.body.appendChild(e),e.select(),document.execCommand("copy"),document.body.removeChild(e),Promise.resolve()},e.prototype.cutText=function(t,e){return this.copyText(t).then(function(){e&&(e.value="",e.textContent="")})},e.prototype.copyFromElement=function(t){var e=t.value||t.textContent;return this.copyText(e)},e.prototype.cutFromElement=function(t){var e=t.value||t.textContent;return this.cutText(e,t)},e.prototype.attach=function(t){var e=document.querySelectorAll(t);e.forEach(function(t){t.addEventListener("click",function(){if(!this.isProcessing){this.isProcessing=!0;var e,n=t.getAttribute("data-clipx-target"),o=t.getAttribute("data-clipx-text"),i=t.hasAttribute("data-clipx-cut"),
|
|
8
|
+
(function(t){function e(){this.attach=this.attach.bind(this),this.isProcessing=!1,this.disable={msg:!1,toast:!1},this.customStyles={}}e.prototype.copyText=function(t){if(navigator.clipboard)return navigator.clipboard.writeText(t);if(navigator.permissions)return navigator.permissions.query({name:"clipboard-write"}).then(function(e){if("granted"===e.state||"prompt"===e.state)return navigator.clipboard.writeText(t);throw new Error("Clipboard write permission denied.")});var e=document.createElement("textarea");return e.value=t,document.body.appendChild(e),e.select(),document.execCommand("copy"),document.body.removeChild(e),Promise.resolve()},e.prototype.cutText=function(t,e){return this.copyText(t).then(function(){e&&(e.value="",e.textContent="")})},e.prototype.copyFromElement=function(t){var e=t.value||t.textContent;return this.copyText(e)},e.prototype.cutFromElement=function(t){var e=t.value||t.textContent;return this.cutText(e,t)},e.prototype.attach=function(t){var e=document.querySelectorAll(t);e.forEach(function(t){t.addEventListener("click",function(){if(!this.isProcessing){this.isProcessing=!0;var e,n=t.getAttribute("data-clipx-target"),o=t.getAttribute("data-clipx-text"),i=t.hasAttribute("data-clipx-cut"),s=t.getAttribute("data-clipx-msg"),a=t.hasAttribute("data-clipx-toast"),r=t.hasAttribute("data-clipx-disable-msg"),c=t.hasAttribute("data-clipx-disable-toast"),l=t.getAttribute("data-clipx-toast-position")||"bottom",p=parseInt(t.getAttribute("data-clipx-duration"),10)||1500;if(n){var d=document.querySelector(n);d&&(e=i?this.cutFromElement(d):this.copyFromElement(d))}else o&&(e=i?this.cutText(o):this.copyText(o));e&&e.then(()=>this.onSuccess(t,s,a,r,c,l,p)).catch(e=>this.onError(t,e)).finally(()=>{this.isProcessing=!1})}}.bind(this))}.bind(this))},e.prototype.onSuccess=function(t,e,n,o,i,s,a){var r=t.textContent,c=e||"Copied !",l="top"===s?"clipx-toast top":"clipx-toast bottom";if(n||o||this.disable.msg||(t.textContent=c),i||this.disable.toast)setTimeout(function(){this.disable.msg||(t.textContent=r)}.bind(this),a);else{var p=document.createElement("div");p.className=l;var d='<svg class="clipx-js-svg-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16" fill="rgba(0,210,65,1)" fill="currentColor"><path d="M4 12C4 7.58172 7.58172 4 12 4C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12ZM12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2ZM17.4571 9.45711L16.0429 8.04289L11 13.0858L8.20711 10.2929L6.79289 11.7071L11 15.9142L17.4571 9.45711Z"></path></svg>';p.innerHTML=d+c,p.setAttribute("role","alert"),p.setAttribute("aria-live","assertive"),p.style.cssText=this.customStyles.toast||"",document.body.appendChild(p),p.style.opacity=0,setTimeout(()=>p.style.opacity=1,0),setTimeout(function(){p.style.opacity=0,setTimeout(()=>document.body.removeChild(p),500),n||o||this.disable.msg||(t.textContent=r)}.bind(this),a)}},e.prototype.onError=function(t,e){console.error("Failed to cut/copy text: ",e);var n=document.createElement("div");n.className="clipx-toast error";var o='<svg xmlns="http://www.w3.org/2000/svg" class="clipx-js-svg-icon" viewBox="0 0 24 24" width="16" height="16" fill="rgba(231,0,0,1)" fill="currentColor"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 15H13V17H11V15ZM11 7H13V13H11V7Z"></path></svg>';n.innerHTML=o+"Failed to copy!",n.setAttribute("role","alert"),n.setAttribute("aria-live","assertive"),n.style.cssText=this.customStyles.toast||"",document.body.appendChild(n),setTimeout(()=>{n.style.opacity=0,setTimeout(()=>document.body.removeChild(n),500)},1500)},e.prototype.setCustomStyles=function(t){this.customStyles=t},t.clipx=e;var n=document.createElement("style");n.textContent="\n .clipx-toast {\n font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n position: fixed;\n left: 50%;\n transform: translateX(-50%);\n background-color: #fff;\n color: #363636;\n padding: 8px 10px;\n border-radius: 8px;\n z-index: 9999;\n box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1), 0 3px 3px rgba(0, 0, 0, 0.05);\n font-size: 14px;\n text-align: center;\n opacity: 0;\n animation: fadeIn 0.5s ease forwards;\n transition: opacity 0.5s ease;\n max-width: 90%; /* Ensure it fits well on smaller screens */\n width: auto; /* Ensure the width adjusts based on content */\n display: flex;\n align-items: center;\n gap: 5px;\n}\n\n.clipx-toast.top {\n top: 20px;\n bottom: auto;\n}\n\n.clipx-toast.bottom {\n bottom: 20px;\n}\n\n.clipx-toast.error {\n background-color: #f8d7da;\n color: #721c24;\n}\n\n@keyframes fadeIn {\n from {\n opacity: 0;\n transform: translateY(10px) translateX(-50%);\n }\n to {\n opacity: 1;\n transform: translateY(0) translateX(-50%);\n }\n}\n\n@keyframes fadeOut {\n from {\n opacity: 1;\n transform: translateY(0) translateX(-50%);\n }\n to {\n opacity: 0;\n transform: translateY(10px) translateX(-50%);\n }\n}",document.head.appendChild(n)})(this);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "clipxjs",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.0",
|
|
4
4
|
"description": "ClipX.js is an ultra-light JavaScript library that simplifies clipboard tasks and enriches user feedback. It offers straightforward copy, cut, and paste capabilities, and built-in toast notifications that you can easily customize, providing a quick and efficient way to handle clipboard and notification needs. ——— The Smarter Clipboard Solution.",
|
|
5
5
|
"main": "src/clipx.js",
|
|
6
6
|
"scripts": {
|
package/src/clipx.js
CHANGED
|
@@ -148,7 +148,7 @@
|
|
|
148
148
|
var toast = document.createElement("div");
|
|
149
149
|
toast.className = toastClass;
|
|
150
150
|
// Insert the success SVG icon along with the custom message
|
|
151
|
-
var successSVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16" fill="rgba(0,210,65,1)" fill="currentColor"><path d="M4 12C4 7.58172 7.58172 4 12 4C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12ZM12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2ZM17.4571 9.45711L16.0429 8.04289L11 13.0858L8.20711 10.2929L6.79289 11.7071L11 15.9142L17.4571 9.45711Z"></path></svg>`;
|
|
151
|
+
var successSVG = `<svg class="clipx-js-svg-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16" fill="rgba(0,210,65,1)" fill="currentColor"><path d="M4 12C4 7.58172 7.58172 4 12 4C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12ZM12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2ZM17.4571 9.45711L16.0429 8.04289L11 13.0858L8.20711 10.2929L6.79289 11.7071L11 15.9142L17.4571 9.45711Z"></path></svg>`;
|
|
152
152
|
toast.innerHTML = successSVG + customMessage;
|
|
153
153
|
toast.setAttribute("role", "alert");
|
|
154
154
|
toast.setAttribute("aria-live", "assertive");
|
|
@@ -189,7 +189,7 @@
|
|
|
189
189
|
var toast = document.createElement("div");
|
|
190
190
|
toast.className = "clipx-toast error";
|
|
191
191
|
// Insert the error SVG icon along with the error message
|
|
192
|
-
var errorSVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16" fill="rgba(231,0,0,1)" fill="currentColor"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 15H13V17H11V15ZM11 7H13V13H11V7Z"></path></svg>`;
|
|
192
|
+
var errorSVG = `<svg xmlns="http://www.w3.org/2000/svg" class="clipx-js-svg-icon" viewBox="0 0 24 24" width="16" height="16" fill="rgba(231,0,0,1)" fill="currentColor"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 15H13V17H11V15ZM11 7H13V13H11V7Z"></path></svg>`;
|
|
193
193
|
toast.innerHTML = errorSVG + "Failed to copy!";
|
|
194
194
|
toast.setAttribute("role", "alert");
|
|
195
195
|
toast.setAttribute("aria-live", "assertive");
|
|
@@ -272,4 +272,4 @@
|
|
|
272
272
|
}
|
|
273
273
|
}`;
|
|
274
274
|
document.head.appendChild(style);
|
|
275
|
-
})(this);
|
|
275
|
+
})(this);
|