sibujs 1.0.3 → 1.0.5

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2025 Fran Ramírez
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2025 Fran Ramírez
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/build.cjs

@@ -1074,6 +1074,7 @@ __export(index_exports, {
   article: () => article,
   aside: () => aside,
   audio: () => audio,
+  autoResize: () => autoResize,
   b: () => b,
   base: () => base,
   batch: () => batch,
@@ -1098,6 +1099,7 @@ __export(index_exports, {
   col: () => col,
   colgroup: () => colgroup,
   context: () => context,
+  copyOnClick: () => copyOnClick,
   customElement: () => customElement,
   data: () => data,
   datalist: () => datalist,
@@ -2847,6 +2849,24 @@ var longPress = (element, options) => {
     element.removeEventListener("pointerleave", cancel);
   };
 };
+var copyOnClick = (element, getText) => {
+  const handler = () => {
+    const text2 = typeof getText === "function" ? getText() : element.textContent ?? "";
+    navigator.clipboard.writeText(text2);
+  };
+  element.addEventListener("click", handler);
+  return () => element.removeEventListener("click", handler);
+};
+var autoResize = (element) => {
+  const resize = () => {
+    element.style.overflow = "hidden";
+    element.style.height = "auto";
+    element.style.height = `${element.scrollHeight}px`;
+  };
+  resize();
+  element.addEventListener("input", resize);
+  return () => element.removeEventListener("input", resize);
+};
 var trapFocus = (element) => {
   const focusable = 'a[href],button:not([disabled]),input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex="-1"])';
   const handler = (e) => {
@@ -3591,35 +3611,123 @@ var errorBoundaryStyles = `
   }
 
   .sibu-error-fallback {
-    border: 2px solid #dc3545;
+    border: 1px solid #e5484d;
     border-radius: 8px;
-    padding: 20px;
+    padding: 0;
     margin: 10px 0;
-    background: linear-gradient(135deg, #fff5f5 0%, #ffebee 100%);
-    box-shadow: 0 2px 12px rgba(220, 53, 69, 0.15);
+    background: #1a1a2e;
+    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4);
     font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+    color: #e1e1e6;
+    overflow: hidden;
+  }
+
+  .sibu-error-fallback .sibu-error-header {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 12px 16px;
+    background: #e5484d;
+    color: white;
   }
 
   .sibu-error-fallback .sibu-error-title {
-    margin: 0 0 12px 0;
-    color: #dc3545;
-    font-size: 1.1em;
+    margin: 0;
+    font-size: 0.95em;
     font-weight: 600;
   }
 
+  .sibu-error-fallback .sibu-error-source {
+    margin-left: auto;
+    font-size: 0.8em;
+    opacity: 0.9;
+    font-family: 'SF Mono', 'Fira Code', 'Roboto Mono', monospace;
+  }
+
+  .sibu-error-fallback .sibu-error-body {
+    padding: 16px;
+  }
+
   .sibu-error-fallback .sibu-error-message {
     font-family: 'SF Mono', 'Fira Code', 'Roboto Mono', monospace;
-    background-color: rgba(0, 0, 0, 0.04);
-    padding: 10px 14px;
-    border-radius: 6px;
-    border: 1px solid rgba(0, 0, 0, 0.08);
-    margin: 10px 0;
-    color: #495057;
+    margin: 0 0 12px 0;
+    color: #f1a9a0;
     word-break: break-word;
     font-size: 0.9em;
     line-height: 1.5;
   }
 
+  .sibu-error-fallback .sibu-error-stack-container {
+    position: relative;
+    margin: 0 0 12px 0;
+    border-radius: 6px;
+    border: 1px solid #2a2a3e;
+    background: #12121f;
+    overflow: hidden;
+  }
+
+  .sibu-error-fallback .sibu-error-stack-label {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 6px 12px;
+    background: #1e1e32;
+    border-bottom: 1px solid #2a2a3e;
+    font-size: 0.75em;
+    color: #888;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+  }
+
+  .sibu-error-fallback .sibu-error-copy-btn {
+    background: transparent;
+    border: 1px solid #3a3a4e;
+    border-radius: 4px;
+    color: #888;
+    cursor: pointer;
+    padding: 2px 8px;
+    font-size: 1em;
+    transition: all 0.15s ease;
+  }
+
+  .sibu-error-fallback .sibu-error-copy-btn:hover {
+    background: #2a2a3e;
+    color: #ccc;
+    border-color: #4a4a5e;
+  }
+
+  .sibu-error-fallback .sibu-error-stack pre {
+    margin: 0;
+    padding: 12px;
+    overflow-x: auto;
+    font-family: 'SF Mono', 'Fira Code', 'Roboto Mono', monospace;
+    font-size: 0.82em;
+    line-height: 1.6;
+    color: #a0a0b0;
+  }
+
+  .sibu-error-fallback .sibu-error-stack .sibu-line-num {
+    display: inline-block;
+    width: 3ch;
+    margin-right: 12px;
+    color: #555;
+    text-align: right;
+    user-select: none;
+  }
+
+  .sibu-error-fallback .sibu-error-stack .sibu-stack-fn {
+    color: #7ec8e3;
+  }
+
+  .sibu-error-fallback .sibu-error-stack .sibu-stack-loc {
+    color: #666;
+  }
+
+  .sibu-error-fallback .sibu-error-actions {
+    display: flex;
+    gap: 8px;
+  }
+
   .sibu-error-fallback .sibu-error-btn {
     display: inline-flex;
     align-items: center;
@@ -3628,22 +3736,28 @@ var errorBoundaryStyles = `
     border: none;
     border-radius: 6px;
     cursor: pointer;
-    font-size: 14px;
+    font-size: 13px;
     font-weight: 500;
-    transition: all 0.2s ease;
-    margin-top: 8px;
-    background-color: #dc3545;
+    transition: all 0.15s ease;
+  }
+
+  .sibu-error-fallback .sibu-error-btn-retry {
+    background: #e5484d;
     color: white;
   }
 
-  .sibu-error-fallback .sibu-error-btn:hover {
-    background-color: #c82333;
-    transform: translateY(-1px);
-    box-shadow: 0 2px 8px rgba(220, 53, 69, 0.3);
+  .sibu-error-fallback .sibu-error-btn-retry:hover {
+    background: #d13438;
   }
 
-  .sibu-error-fallback .sibu-error-btn:active {
-    transform: translateY(0);
+  .sibu-error-fallback .sibu-error-btn-reload {
+    background: #2a2a3e;
+    color: #ccc;
+    border: 1px solid #3a3a4e;
+  }
+
+  .sibu-error-fallback .sibu-error-btn-reload:hover {
+    background: #3a3a4e;
   }
 `;
 var stylesInjected = false;
@@ -3667,6 +3781,35 @@ function getMemoizedFallback(fallbackFn, error, retry) {
   }
   return cache2.get(key);
 }
+function parseStack(err) {
+  const stack = err.stack || "";
+  const lines = stack.split("\n");
+  const frames = [];
+  let source2 = "";
+  for (const line2 of lines) {
+    const trimmed = line2.trim();
+    const chromeMatch = trimmed.match(/^at\s+(?:(.+?)\s+\((.+)\)|(.+))$/);
+    if (chromeMatch) {
+      const fn = chromeMatch[1] || "(anonymous)";
+      const loc = chromeMatch[2] || chromeMatch[3] || "";
+      frames.push({ fn, loc });
+      if (!source2 && fn !== "(anonymous)" && !fn.startsWith("Object.") && !fn.startsWith("Module.")) {
+        source2 = fn;
+      }
+      continue;
+    }
+    const firefoxMatch = trimmed.match(/^(.+?)@(.+)$/);
+    if (firefoxMatch) {
+      const fn = firefoxMatch[1] || "(anonymous)";
+      const loc = firefoxMatch[2] || "";
+      frames.push({ fn, loc });
+      if (!source2 && fn !== "(anonymous)") {
+        source2 = fn;
+      }
+    }
+  }
+  return { source: source2, frames };
+}
 function ErrorBoundary({ nodes, fallback, onError }) {
   injectStyles();
   const [error, setError] = signal(null);
@@ -3682,24 +3825,112 @@ function ErrorBoundary({ nodes, fallback, onError }) {
     onError?.(errorObj);
     return errorObj;
   };
-  const defaultFallback = (err, retryFn) => div({
-    class: "sibu-error-fallback",
-    nodes: [
-      h3({
-        nodes: "Something went wrong",
-        class: "sibu-error-title"
-      }),
-      p({
-        nodes: _isDev8 ? err.message : "An unexpected error occurred. Please try again.",
-        class: "sibu-error-message"
-      }),
-      button({
-        nodes: "Retry",
-        class: "sibu-error-btn",
-        on: { click: retryFn }
+  const defaultFallback = (err, retryFn) => {
+    if (!_isDev8) {
+      return div({
+        class: "sibu-error-fallback",
+        nodes: [
+          div({
+            class: "sibu-error-header",
+            nodes: [h3({ nodes: "Something went wrong", class: "sibu-error-title" })]
+          }),
+          div({
+            class: "sibu-error-body",
+            nodes: [
+              p({ nodes: "An unexpected error occurred. Please try again.", class: "sibu-error-message" }),
+              div({
+                class: "sibu-error-actions",
+                nodes: [
+                  button({
+                    nodes: "Retry",
+                    class: "sibu-error-btn sibu-error-btn-retry",
+                    on: { click: retryFn }
+                  }),
+                  button({
+                    nodes: "Reload Page",
+                    class: "sibu-error-btn sibu-error-btn-reload",
+                    on: { click: () => location.reload() }
+                  })
+                ]
+              })
+            ]
+          })
+        ]
+      });
+    }
+    const { source: source2, frames } = parseStack(err);
+    const fullText = `${err.message}
+
+${err.stack || ""}`;
+    const copyBtn = button({
+      nodes: "Copy",
+      class: "sibu-error-copy-btn",
+      on: {
+        click: () => {
+          navigator.clipboard.writeText(fullText).then(() => {
+            copyBtn.textContent = "Copied!";
+            setTimeout(() => {
+              copyBtn.textContent = "Copy";
+            }, 1500);
+          });
+        }
+      }
+    });
+    const stackLines = frames.map(
+      (f, i2) => div({
+        nodes: [
+          span({ class: "sibu-line-num", nodes: String(i2 + 1) }),
+          span({ class: "sibu-stack-fn", nodes: f.fn }),
+          span({ class: "sibu-stack-loc", nodes: ` ${f.loc}` })
+        ]
       })
-    ]
-  });
+    );
+    return div({
+      class: "sibu-error-fallback",
+      nodes: [
+        div({
+          class: "sibu-error-header",
+          nodes: [
+            h3({ nodes: source2 ? `Error in ${source2}` : "Something went wrong", class: "sibu-error-title" }),
+            ...source2 ? [] : [span()]
+          ]
+        }),
+        div({
+          class: "sibu-error-body",
+          nodes: [
+            p({ nodes: err.message, class: "sibu-error-message" }),
+            ...frames.length > 0 ? [
+              div({
+                class: "sibu-error-stack-container",
+                nodes: [
+                  div({
+                    class: "sibu-error-stack-label",
+                    nodes: [span({ nodes: "Stack Trace" }), copyBtn]
+                  }),
+                  div({ class: "sibu-error-stack", nodes: [pre({ nodes: stackLines })] })
+                ]
+              })
+            ] : [],
+            div({
+              class: "sibu-error-actions",
+              nodes: [
+                button({
+                  nodes: "Retry",
+                  class: "sibu-error-btn sibu-error-btn-retry",
+                  on: { click: retryFn }
+                }),
+                button({
+                  nodes: "Reload Page",
+                  class: "sibu-error-btn sibu-error-btn-reload",
+                  on: { click: () => location.reload() }
+                })
+              ]
+            })
+          ]
+        })
+      ]
+    });
+  };
   const tryRenderFallback = (err) => {
     const fn = fallback || defaultFallback;
     try {

package/dist/build.js

@@ -1,6 +1,6 @@
 import {
   index_exports
-} from "./chunk-MEZVEBPN.js";
+} from "./chunk-VAU366PN.js";
 import "./chunk-EWFVA3TJ.js";
 import "./chunk-CZUGLNJS.js";
 import "./chunk-Z65KYU7I.js";