@canopy-iiif/app 1.6.5 → 1.6.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canopy-iiif/app",
-  "version": "1.6.5",
+  "version": "1.6.7",
   "private": false,
   "license": "MIT",
   "author": "Mat Jordan <mat@northwestern.edu>",

package/ui/dist/server.mjs

@@ -1326,7 +1326,7 @@ function ContentNavigation({
           "svg",
           {
             xmlns: "http://www.w3.org/2000/svg",
-            class: "ionicon",
+            className: "ionicon",
             viewBox: "0 0 512 512"
           },
           /* @__PURE__ */ React12.createElement(
@@ -1334,9 +1334,9 @@ function ContentNavigation({
             {
               fill: "none",
               stroke: "currentColor",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round",
-              "stroke-width": "50",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              strokeWidth: "50",
               d: "M160 144h288M160 256h288M160 368h288"
             }
           ),
@@ -1348,9 +1348,9 @@ function ContentNavigation({
               r: "16",
               fill: "none",
               stroke: "currentColor",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round",
-              "stroke-width": "32"
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              strokeWidth: "32"
             }
           ),
           /* @__PURE__ */ React12.createElement(
@@ -1361,9 +1361,9 @@ function ContentNavigation({
               r: "16",
               fill: "none",
               stroke: "currentColor",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round",
-              "stroke-width": "32"
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              strokeWidth: "32"
             }
           ),
           /* @__PURE__ */ React12.createElement(
@@ -1374,9 +1374,9 @@ function ContentNavigation({
               r: "16",
               fill: "none",
               stroke: "currentColor",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round",
-              "stroke-width": "32"
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              strokeWidth: "32"
             }
           )
         )
@@ -4619,8 +4619,9 @@ function DocsCodeBlock(props = {}) {
   const copyAttr = codeProps["data-copy"];
   const enableCopy = copyAttr !== void 0 ? copyAttr === true || copyAttr === "true" || copyAttr === "" : false;
   const [copied, setCopied] = React41.useState(false);
+  const buttonRef = React41.useRef(null);
   const handleCopy = React41.useCallback(async () => {
-    const text = rawCode;
+    const text = trimmedCode;
     try {
       if (typeof navigator !== "undefined" && navigator.clipboard && navigator.clipboard.writeText) {
         await navigator.clipboard.writeText(text);
@@ -4636,11 +4637,21 @@ function DocsCodeBlock(props = {}) {
         document.body.removeChild(textarea);
       }
       setCopied(true);
-      setTimeout(() => setCopied(false), 1500);
+      setTimeout(() => setCopied(false), 5e3);
     } catch (_) {
       setCopied(false);
     }
-  }, [rawCode]);
+  }, [trimmedCode]);
+  React41.useEffect(() => {
+    if (buttonRef.current) {
+      buttonRef.current.setAttribute("data-docs-copy-hydrated", "true");
+    }
+  }, []);
+  React41.useEffect(() => {
+    if (!buttonRef.current) return;
+    if (copied) buttonRef.current.setAttribute("data-docs-copy-active", "true");
+    else buttonRef.current.removeAttribute("data-docs-copy-active");
+  }, [copied]);
   const containerStyle = {
     borderRadius: "12px",
     overflow: "hidden",
@@ -4667,6 +4678,21 @@ function DocsCodeBlock(props = {}) {
     padding: "1rem 0",
     overflowX: "auto"
   };
+  const buttonStyle = {
+    border: "1px solid var(--color-accent-200, )",
+    borderRadius: "6px",
+    padding: "0.25rem 0.65rem",
+    fontSize: "0.7rem",
+    fontWeight: 600,
+    color: "var(--color-accent-default)",
+    cursor: "pointer",
+    display: "inline-flex",
+    alignItems: "center",
+    gap: "0.3rem",
+    background: "var(--docs-copy-bg, rgba(255,255,255,0.08))",
+    transform: "var(--docs-copy-transform, scale(1))",
+    transition: "transform 150ms ease, background-color 150ms ease, color 150ms ease"
+  };
   const codeStyle = {
     display: "block",
     padding: 0
@@ -4686,13 +4712,20 @@ function DocsCodeBlock(props = {}) {
     const displayLine = line === "" ? " " : line;
     return React41.createElement(
       "span",
-      { key: lineNumber, style },
+      {
+        key: lineNumber,
+        style,
+        "data-docs-code-line": line
+      },
       React41.createElement("span", { style: lineContentStyle }, displayLine)
     );
   });
   return React41.createElement(
     "div",
-    { style: containerStyle },
+    {
+      style: containerStyle,
+      "data-docs-code-block": "true"
+    },
     showHeader ? React41.createElement(
       "div",
       { style: headerStyle },
@@ -4700,23 +4733,40 @@ function DocsCodeBlock(props = {}) {
       enableCopy ? React41.createElement(
         "button",
         {
+          ref: buttonRef,
           type: "button",
           onClick: handleCopy,
           "aria-live": "polite",
           "aria-label": copied ? "Copied to clipboard" : "Copy code to clipboard",
-          style: {
-            border: "1px solid var(--color-accent-200, )",
-            borderRadius: "6px",
-            padding: "0.2rem 0.55rem",
-            fontSize: "0.7rem",
-            fontWeight: 500,
-            color: "var(--color-accent-default)",
-            cursor: "pointer"
-          }
+          "data-docs-copy-button": "true",
+          style: buttonStyle
         },
-        copied ? "Copied" : "Copy"
+        React41.createElement("span", null, "Copy"),
+        React41.createElement(
+          "span",
+          {
+            "aria-hidden": "true",
+            "data-docs-copy-icon": "true"
+          },
+          "\u2713"
+        )
       ) : null
     ) : null,
+    enableCopy ? React41.createElement("textarea", {
+      "data-docs-copy-source": "true",
+      tabIndex: -1,
+      readOnly: true,
+      "aria-hidden": "true",
+      defaultValue: trimmedCode,
+      style: {
+        position: "absolute",
+        left: "-9999px",
+        width: 1,
+        height: 1,
+        opacity: 0,
+        pointerEvents: "none"
+      }
+    }) : null,
     React41.createElement(
       "pre",
       { ...preRest, className: preClassName, style: mergedPreStyle },