senangwebs-photobooth 1.0.1

package/dist/swp.css

@@ -0,0 +1,448 @@
+@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css);
+/**
+ * SenangWebs Photobooth (SWP) - Styles
+ * @version 1.0.0
+ */
+
+/* Font Awesome */
+
+/* Container */
+.swp-container {
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+    max-width: 1200px;
+    box-sizing: border-box;
+}
+
+.swp-wrapper {
+    background: #ffffff;
+    overflow: hidden;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+}
+
+/* Toolbar */
+.swp-toolbar {
+    display: flex;
+    gap: 8px;
+    padding: 8px;
+    background: #f8f9fa;
+    flex-wrap: wrap;
+    justify-content: space-between;
+}
+
+.swp-toolbar-group {
+    display: flex;
+    gap: 0px;
+    align-items: center;
+    border: 1px solid #dee2e6;
+    border-radius: 8px;
+    overflow: hidden;
+}
+
+.swp-toolbar-group .swp-btn {
+    display: flex;
+    flex-direction: column;
+    gap: 0px;
+    height: 48px;
+    width: 80px;
+    min-width: 48px;
+    align-items: center;
+    justify-content: center;
+    border-radius: 0px;
+    border: none;
+    padding: 0px;
+}
+
+.swp-toolbar-group .swp-btn span {
+    font-size: 12px;
+}
+
+.swp-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    padding: 0px 12px;
+    border: 1px solid #dee2e6;
+    background: #ffffff;
+    border-radius: 6px;
+    cursor: pointer;
+    font-size: 14px;
+    color: #495057;
+    transition: all 0.2s ease;
+    font-family: inherit;
+    height: 40px;
+}
+
+.swp-btn:hover {
+    background: #e9ecef;
+    border-color: #adb5bd;
+}
+
+.swp-btn:active {
+    transform: scale(0.98);
+}
+
+.swp-btn-primary {
+    background: #007bff;
+    color: white;
+    border-color: #007bff;
+}
+
+.swp-btn-primary:hover {
+    background: #0056b3;
+    border-color: #0056b3;
+}
+
+.swp-btn-icon-only {
+    padding: 0px 12px;
+    justify-content: center;
+    align-items: center;
+    aspect-ratio: 1 / 1;
+    max-width: 40px;
+}
+
+.swp-icon {
+    font-size: 18px;
+}
+
+.swp-layout-container {
+    display: flex;
+    flex-grow: 1;
+}
+
+.swp-control-container {
+    min-width: 348px;
+    background: #f8f9fa;
+    padding: 8px 16px;
+}
+
+.swp-control-container.hidden {
+    display: block;
+}
+
+/* Canvas Container */
+.swp-canvas-container {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 400px;
+    padding: 8px;
+    border-top: 1px solid #dee2e6;
+    border-right: 1px solid #dee2e6;
+    border-top-right-radius: 8px;
+    flex-grow: 1;
+    min-width: 452px;;
+}
+
+.swp-canvas {
+    max-width: 100%;
+    height: auto;
+    background: white;
+}
+
+/* Adjustments Panel */
+.swp-adjustments-panel,
+.swp-filters-panel,
+.swp-resize-panel {
+    display: none;
+}
+
+.swp-adjustments-panel.active,
+.swp-filters-panel.active,
+.swp-resize-panel.active {
+    display: block;
+}
+
+.swp-adjustments-panel h3,
+.swp-filters-panel h3,
+.swp-resize-panel h3 {
+    margin: 0 0 15px 0;
+    font-size: 16px;
+    font-weight: 600;
+    color: #212529;
+}
+
+.swp-adjustment {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    margin-bottom: 15px;
+    width: 100%;
+}
+
+.swp-adjustment label {
+    min-width: 100px;
+    font-size: 14px;
+    color: #495057;
+    font-weight: 500;
+}
+
+.swp-adjustment input[type="range"] {
+    flex: 1;
+    flex-shrink: 1;
+    height: 6px;
+    border-radius: 3px;
+    background: #e9ecef;
+    outline: none;
+    -webkit-appearance: none;
+}
+
+.swp-adjustment input[type="range"]::-webkit-slider-thumb {
+    -webkit-appearance: none;
+    appearance: none;
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    background: #007bff;
+    cursor: pointer;
+    transition: all 0.2s ease;
+}
+
+.swp-adjustment input[type="range"]::-webkit-slider-thumb:hover {
+    background: #0056b3;
+    transform: scale(1.1);
+}
+
+.swp-adjustment input[type="range"]::-moz-range-thumb {
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    background: #007bff;
+    cursor: pointer;
+    border: none;
+    transition: all 0.2s ease;
+}
+
+.swp-adjustment input[type="range"]::-moz-range-thumb:hover {
+    background: #0056b3;
+    transform: scale(1.1);
+}
+
+.swp-value {
+    text-align: right;
+    font-size: 14px;
+    color: #6c757d;
+    font-weight: 500;
+}
+
+/* Resize Panel */
+.swp-resize-controls {
+    display: flex;
+    flex-direction: column;
+    gap: 15px;
+}
+
+.swp-resize-controls .swp-adjustment {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+}
+
+.swp-resize-controls input[type="number"] {
+    flex: 1;
+    padding: 8px 12px;
+    border: 1px solid #dee2e6;
+    border-radius: 6px;
+    font-size: 14px;
+    color: #495057;
+}
+
+.swp-resize-controls input[type="number"]:focus {
+    outline: none;
+    border-color: #007bff;
+}
+
+.swp-resize-controls input[type="checkbox"] {
+    width: 18px;
+    height: 18px;
+    cursor: pointer;
+}
+
+.swp-resize-controls label {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    cursor: pointer;
+    font-size: 14px;
+    color: #495057;
+}
+
+.swp-resize-controls button {
+    margin-top: 10px;
+}
+
+
+/* Filters Panel */
+.swp-filters-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
+    gap: 15px;
+}
+
+.swp-filter-btn {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 8px;
+    padding: 12px;
+    border: 2px solid #dee2e6;
+    background: #ffffff;
+    border-radius: 8px;
+    cursor: pointer;
+    font-size: 13px;
+    color: #495057;
+    transition: all 0.2s ease;
+    font-family: inherit;
+}
+
+.swp-filter-btn:hover {
+    border-color: #007bff;
+    background: #f8f9fa;
+}
+
+.swp-filter-btn.active {
+    border-color: #007bff;
+    background: #e7f3ff;
+    color: #007bff;
+    font-weight: 600;
+}
+
+.swp-filter-preview {
+    width: 60px;
+    height: 60px;
+    border-radius: 6px;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    display: block;
+}
+
+.swp-filter-preview[data-filter="grayscale"] {
+    filter: grayscale(100%);
+}
+
+.swp-filter-preview[data-filter="sepia"] {
+    filter: sepia(100%);
+}
+
+.swp-filter-preview[data-filter="invert"] {
+    filter: invert(100%);
+}
+
+.swp-filter-preview[data-filter="blur"] {
+    filter: blur(3px);
+}
+
+.swp-filter-preview[data-filter="none"] {
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+}
+
+/* Responsive Design */
+@media (max-width: 768px) {
+    .swp-toolbar {
+        padding: 10px;
+        gap: 5px;
+    }
+
+    .swp-toolbar-group {
+        gap: 5px;
+    }
+
+    .swp-btn {
+        padding: 6px 12px;
+        font-size: 12px;
+    }
+
+    .swp-btn span:not(.swp-icon) {
+        display: none;
+    }
+
+    .swp-canvas-container {
+        min-height: 300px;
+        padding: 10px;
+    }
+
+    .swp-adjustments-panel,
+    .swp-filters-panel {
+        padding: 15px;
+    }
+
+    .swp-adjustment {
+        flex-wrap: wrap;
+    }
+
+    .swp-adjustment label {
+        min-width: 100%;
+    }
+
+    .swp-filters-grid {
+        grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
+        gap: 10px;
+    }
+
+    .swp-filter-preview {
+        width: 50px;
+        height: 50px;
+    }
+}
+
+/* Loading State */
+.swp-loading {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    font-size: 14px;
+    color: #6c757d;
+}
+
+/* Empty State */
+.swp-empty-state {
+    text-align: center;
+    padding: 60px 20px;
+    color: #6c757d;
+}
+
+.swp-empty-state-icon {
+    font-size: 48px;
+    margin-bottom: 15px;
+    opacity: 0.5;
+}
+
+.swp-empty-state-text {
+    font-size: 16px;
+    margin-bottom: 20px;
+}
+
+/* Animations */
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+        transform: translateY(-10px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+.swp-adjustments-panel.active,
+.swp-filters-panel.active {
+    animation: fadeIn 0.3s ease;
+}
+
+/* Print Styles */
+@media print {
+    .swp-toolbar,
+    .swp-adjustments-panel,
+    .swp-filters-panel {
+        display: none;
+    }
+
+    .swp-canvas-container {
+        padding: 0;
+        background: transparent;
+    }
+}
+

package/dist/swp.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.SWP=t():e.SWP=t()}(this,()=>(()=>{"use strict";var e={d:(t,a)=>{for(var s in a)e.o(a,s)&&!e.o(t,s)&&Object.defineProperty(t,s,{enumerable:!0,get:a[s]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},t={};e.d(t,{default:()=>s});class a{constructor(e,t={}){this.container=e,this.options={imageUrl:t.imageUrl||null,width:t.width||800,height:t.height||600,showIcons:void 0===t.showIcons||t.showIcons,showLabels:void 0===t.showLabels||t.showLabels,labels:{upload:void 0!==t.labels?.upload?t.labels.upload:"Upload",rotateLeft:void 0!==t.labels?.rotateLeft?t.labels.rotateLeft:null,rotateRight:void 0!==t.labels?.rotateRight?t.labels.rotateRight:null,flipH:void 0!==t.labels?.flipH?t.labels.flipH:null,flipV:void 0!==t.labels?.flipV?t.labels.flipV:null,resize:void 0!==t.labels?.resize?t.labels.resize:"Resize",adjust:void 0!==t.labels?.adjust?t.labels.adjust:"Adjust",filters:void 0!==t.labels?.filters?t.labels.filters:"Filters",reset:void 0!==t.labels?.reset?t.labels.reset:"Reset",save:void 0!==t.labels?.save?t.labels.save:"Save"}},this.canvas=null,this.ctx=null,this.originalImage=null,this.currentImage=null,this.history=[],this.currentState={brightness:100,contrast:100,saturation:100,rotation:0,flipH:!1,flipV:!1,filter:"none"},this.eventListeners={},this.init()}init(){this.createUI(),this.options.imageUrl&&this.loadImage(this.options.imageUrl)}createUI(){this.container.innerHTML="",this.container.classList.add("swp-container");const e=document.createElement("div");e.className="swp-wrapper";const t=document.createElement("div");t.className="swp-toolbar",t.innerHTML=this.createToolbarHTML();const a=document.createElement("div");a.className="swp-layout-container";const s=document.createElement("div");s.className="swp-control-container";const n=document.createElement("div");n.className="swp-canvas-container",this.canvas=document.createElement("canvas"),this.canvas.width=this.options.width,this.canvas.height=this.options.height,this.canvas.className="swp-canvas",this.ctx=this.canvas.getContext("2d"),n.appendChild(this.canvas);const i=document.createElement("div");i.className="swp-adjustments-panel",i.innerHTML=this.createAdjustmentsPanelHTML();const r=document.createElement("div");r.className="swp-filters-panel",r.innerHTML=this.createFiltersPanelHTML();const l=document.createElement("div");l.className="swp-resize-panel",l.innerHTML=this.createResizePanelHTML(),e.appendChild(t),e.appendChild(a),a.appendChild(n),a.appendChild(s),s.appendChild(i),s.appendChild(r),s.appendChild(l),this.container.appendChild(e),this.bindEvents()}createToolbarHTML(){const{showIcons:e,showLabels:t,labels:a}=this.options,s=(a,s,n,i)=>{const r=t&&null!==n?`<span>${n}</span>`:"";return`<button class="swp-btn${r?"":" swp-btn-icon-only"}" data-action="${a}" title="${i}">${e?`<span class="swp-icon"><i class="${s}"></i></span>`:""}${r}</button>`};return`\n                <div class="swp-toolbar-group">\n                    ${s("upload","fas fa-folder",a.upload,"Upload Image")}\n                    <input type="file" id="swp-file-input" accept="image/*" style="display: none;">\n                </div>\n                \n                <div class="swp-toolbar-group" style="margin: 0px auto;">\n                    ${s("rotate-left","fas fa-undo",a.rotateLeft,"Rotate Left")}\n                    ${s("rotate-right","fas fa-redo",a.rotateRight,"Rotate Right")}\n                    ${s("flip-h","fas fa-arrows-alt-h",a.flipH,"Flip Horizontal")}\n                    ${s("flip-v","fas fa-arrows-alt-v",a.flipV,"Flip Vertical")}\n                </div>\n\n                <div class="swp-toolbar-group">\n                    ${s("reset","fas fa-history",a.reset,"Reset")}\n                </div>\n\n                <div class="swp-toolbar-group">\n                    ${s("toggle-resize","fas fa-expand-arrows-alt",a.resize,"Resize")}\n                    ${s("toggle-adjustments","fas fa-sliders-h",a.adjust,"Adjustments")}\n                    ${s("toggle-filters","fas fa-magic",a.filters,"Filters")}\n                </div>\n                <div class="swp-toolbar-group">\n                    <button class="swp-btn swp-btn-primary${t&&null!==a.save?"":" swp-btn-icon-only"}" data-action="download" title="Download">\n                        ${e?'<span class="swp-icon"><i class="fas fa-save"></i></span>':""}\n                        ${t&&null!==a.save?`<span>${a.save}</span>`:""}\n                    </button>\n                </div>\n            `}createAdjustmentsPanelHTML(){return'\n                <h3>Adjustments</h3>\n                <div class="swp-adjustment">\n                    <label>Brightness</label>\n                    <input type="range" id="swp-brightness" min="0" max="200" value="100">\n                    <span class="swp-value">100%</span>\n                </div>\n                <div class="swp-adjustment">\n                    <label>Contrast</label>\n                    <input type="range" id="swp-contrast" min="0" max="200" value="100">\n                    <span class="swp-value">100%</span>\n                </div>\n                <div class="swp-adjustment">\n                    <label>Saturation</label>\n                    <input type="range" id="swp-saturation" min="0" max="200" value="100">\n                    <span class="swp-value">100%</span>\n                </div>\n            '}createResizePanelHTML(){return'\n                <h3>Resize Image</h3>\n                <div class="swp-resize-controls">\n                    <div class="swp-adjustment">\n                        <label>Width (px)</label>\n                        <input type="number" id="swp-resize-width" min="1" max="5000" value="800">\n                    </div>\n                    <div class="swp-adjustment">\n                        <label>Height (px)</label>\n                        <input type="number" id="swp-resize-height" min="1" max="5000" value="600">\n                    </div>\n                    <div class="swp-adjustment">\n                        <label>\n                            <input type="checkbox" id="swp-maintain-ratio" checked>\n                            Maintain aspect ratio\n                        </label>\n                    </div>\n                    <button class="swp-btn swp-btn-primary" data-action="apply-resize">Apply Resize</button>\n                </div>\n            '}createFiltersPanelHTML(){return`\n                <h3>Filters</h3>\n                <div class="swp-filters-grid">\n                    ${[{name:"none",label:"None"},{name:"grayscale",label:"Grayscale"},{name:"sepia",label:"Sepia"},{name:"invert",label:"Invert"},{name:"blur",label:"Blur"}].map(e=>`\n                        <button class="swp-filter-btn ${"none"===e.name?"active":""}" \n                                data-filter="${e.name}">\n                            <span class="swp-filter-preview" data-filter="${e.name}"></span>\n                            <span>${e.label}</span>\n                        </button>\n                    `).join("")}\n                </div>\n            `}bindEvents(){this.container.querySelectorAll("[data-action]").forEach(e=>{e.addEventListener("click",e=>{const t=e.currentTarget.getAttribute("data-action");this.handleAction(t)})});const e=this.container.querySelector("#swp-file-input");e&&e.addEventListener("change",e=>{const t=e.target.files[0];if(t){const e=new FileReader;e.onload=e=>{this.loadImage(e.target.result)},e.readAsDataURL(t)}}),["brightness","contrast","saturation"].forEach(e=>{const t=this.container.querySelector(`#swp-${e}`);t&&t.addEventListener("input",t=>{const a=parseInt(t.target.value);t.target.nextElementSibling.textContent=a+"%",this.setAdjustment(e,a)})}),this.container.querySelectorAll("[data-filter]").forEach(e=>{e.classList.contains("swp-filter-btn")&&e.addEventListener("click",e=>{const t=e.currentTarget.getAttribute("data-filter");this.applyFilter(t),this.container.querySelectorAll(".swp-filter-btn").forEach(e=>{e.classList.remove("active")}),e.currentTarget.classList.add("active")})})}bindResizeInputs(){const e=this.container.querySelector("#swp-resize-width"),t=this.container.querySelector("#swp-resize-height"),a=this.container.querySelector("#swp-maintain-ratio");if(!e||!t||!this.currentImage)return;const s=e.cloneNode(!0),n=t.cloneNode(!0);e.parentNode.replaceChild(s,e),t.parentNode.replaceChild(n,t);const i=this.currentImage.width/this.currentImage.height;s.addEventListener("input",e=>{const t=parseInt(e.target.value);if(a.checked){const e=Math.round(t/i);n.value=e}this.updateCanvasSize(parseInt(s.value),parseInt(n.value))}),n.addEventListener("input",e=>{const t=parseInt(e.target.value);if(a.checked){const e=Math.round(t*i);s.value=e}this.updateCanvasSize(parseInt(s.value),parseInt(n.value))})}updateCanvasSize(e,t){!this.currentImage||!e||!t||e<1||t<1||(this.canvas.width=e,this.canvas.height=t,this.drawImage())}handleAction(e){switch(e){case"upload":this.container.querySelector("#swp-file-input").click();break;case"rotate-left":this.rotate(-90);break;case"rotate-right":this.rotate(90);break;case"flip-h":this.flip("horizontal");break;case"flip-v":this.flip("vertical");break;case"toggle-adjustments":this.togglePanel(".swp-adjustments-panel");break;case"toggle-filters":this.togglePanel(".swp-filters-panel");break;case"toggle-resize":this.togglePanel(".swp-resize-panel");break;case"apply-resize":this.applyResize();break;case"reset":this.reset();break;case"download":this.download()}}togglePanel(e){const t=this.container.querySelector(e);t&&(t.classList.toggle("active"),[".swp-adjustments-panel",".swp-filters-panel",".swp-resize-panel"].forEach(t=>{t!==e&&this.container.querySelector(t)?.classList.remove("active")}))}loadImage(e){const t=new Image;t.crossOrigin="anonymous",t.onload=()=>{this.originalImage=t,this.currentImage=t,this.canvas.width=t.width,this.canvas.height=t.height;const e=this.container.querySelector("#swp-resize-width"),a=this.container.querySelector("#swp-resize-height");e&&(e.value=t.width),a&&(a.value=t.height),this.bindResizeInputs(),this.drawImage(),this.emit("load")},t.onerror=()=>{console.error("Failed to load image")},t.src=e}drawImage(){if(!this.currentImage)return;const e=this.canvas,t=this.ctx;t.clearRect(0,0,e.width,e.height),t.save(),t.translate(e.width/2,e.height/2),t.rotate(this.currentState.rotation*Math.PI/180),t.scale(this.currentState.flipH?-1:1,this.currentState.flipV?-1:1),t.filter=this.getFilterString(),t.drawImage(this.currentImage,-e.width/2,-e.height/2,e.width,e.height),t.restore(),this.emit("change")}getFilterString(){let e=[];switch(100!==this.currentState.brightness&&e.push(`brightness(${this.currentState.brightness}%)`),100!==this.currentState.contrast&&e.push(`contrast(${this.currentState.contrast}%)`),100!==this.currentState.saturation&&e.push(`saturate(${this.currentState.saturation}%)`),this.currentState.filter){case"grayscale":e.push("grayscale(100%)");break;case"sepia":e.push("sepia(100%)");break;case"invert":e.push("invert(100%)");break;case"blur":e.push("blur(5px)")}return e.length>0?e.join(" "):"none"}rotate(e){this.currentImage&&(this.currentState.rotation=(this.currentState.rotation+e)%360,this.drawImage())}flip(e){this.currentImage&&("horizontal"===e?this.currentState.flipH=!this.currentState.flipH:"vertical"===e&&(this.currentState.flipV=!this.currentState.flipV),this.drawImage())}setAdjustment(e,t){this.currentImage&&(this.currentState[e]=t,this.drawImage())}applyFilter(e){this.currentImage&&(this.currentState.filter=e,this.drawImage())}applyResize(){if(!this.currentImage)return;const e=this.container.querySelector("#swp-resize-width"),t=this.container.querySelector("#swp-resize-height"),a=parseInt(e.value),s=parseInt(t.value);if(!a||!s||a<1||s<1)return void alert("Please enter valid dimensions");const n=document.createElement("canvas");n.width=this.canvas.width,n.height=this.canvas.height,n.getContext("2d").drawImage(this.canvas,0,0);const i=new Image;i.onload=()=>{this.currentImage=i,this.originalImage=i,this.bindResizeInputs(),this.drawImage()},i.src=n.toDataURL()}crop(e,t,a,s){if(!this.currentImage)return;const n=document.createElement("canvas");n.width=a,n.height=s,n.getContext("2d").drawImage(this.canvas,e,t,a,s,0,0,a,s);const i=new Image;i.onload=()=>{this.currentImage=i,this.drawImage()},i.src=n.toDataURL()}reset(){this.currentState={brightness:100,contrast:100,saturation:100,rotation:0,flipH:!1,flipV:!1,filter:"none"},["brightness","contrast","saturation"].forEach(e=>{const t=this.container.querySelector(`#swp-${e}`);t&&(t.value=100,t.nextElementSibling.textContent="100%")}),this.container.querySelectorAll(".swp-filter-btn").forEach(e=>{e.classList.remove("active"),"none"===e.getAttribute("data-filter")&&e.classList.add("active")}),this.originalImage&&(this.currentImage=this.originalImage,this.drawImage())}getImageData(e="jpeg",t=.9){if(!this.canvas)return null;const a="png"===e?"image/png":"image/jpeg";return this.canvas.toDataURL(a,t)}download(){const e=this.getImageData("png");if(!e)return;const t=document.createElement("a");t.download=`swp-edited-${Date.now()}.png`,t.href=e,t.click(),this.emit("save")}on(e,t){this.eventListeners[e]||(this.eventListeners[e]=[]),this.eventListeners[e].push(t)}emit(e,t){this.eventListeners[e]&&this.eventListeners[e].forEach(e=>{e(t)})}}"undefined"!=typeof document&&document.addEventListener("DOMContentLoaded",()=>{document.querySelectorAll("[data-swp]").forEach(e=>{const t={};if(e.dataset.swpImageUrl&&(t.imageUrl=e.dataset.swpImageUrl),e.dataset.swpWidth&&(t.width=parseInt(e.dataset.swpWidth)),e.dataset.swpHeight&&(t.height=parseInt(e.dataset.swpHeight)),void 0!==e.dataset.swpShowIcons&&(t.showIcons="false"!==e.dataset.swpShowIcons),void 0!==e.dataset.swpShowLabels&&(t.showLabels="false"!==e.dataset.swpShowLabels),e.dataset.swpLabels)try{let a=e.dataset.swpLabels.trim();a.startsWith("{")?t.labels=JSON.parse(a):(t.labels={},a.split(";").forEach(e=>{const[a,s]=e.split(":").map(e=>e.trim());if(a&&s){const e=s.replace(/^['"]|['"]$/g,"");t.labels[a]="null"===e?null:e}}))}catch(e){console.error("Failed to parse data-swp-labels:",e)}new a(e,t)})});const s=a;return"undefined"!=typeof window&&(window.SWP=a),t.default})());