@canopy-iiif/app 1.5.8 → 1.5.9

package/package.json

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

package/ui/dist/index.mjs

@@ -93,6 +93,7 @@ function Card({
         {
           src,
           alt: alt || title || "",
+          "aria-hidden": !alt && !title ? "true" : void 0,
           loading: "lazy",
           onLoad: () => setImageLoaded(true),
           onError: () => setImageLoaded(true)
@@ -103,6 +104,7 @@ function Card({
       {
         src,
         alt: alt || title || "",
+        "aria-hidden": !alt && !title ? "true" : void 0,
         loading: "lazy",
         onLoad: () => setImageLoaded(true),
         onError: () => setImageLoaded(true),
@@ -269,7 +271,7 @@ function renderMarkdownTokens(tokens, query, keyPrefix = "token") {
       case "code":
         return /* @__PURE__ */ React3.createElement("code", { key }, token.value);
       case "link":
-        return /* @__PURE__ */ React3.createElement("a", { key, href: token.href, target: "_blank", rel: "noreferrer" }, renderMarkdownTokens(token.children || [], query, key));
+        return /* @__PURE__ */ React3.createElement("a", { key, href: token.href, target: "_blank", rel: "noreferrer" }, renderMarkdownTokens(token.children || [], query, key), /* @__PURE__ */ React3.createElement("span", { className: "sr-only" }, " (opens in new tab)"));
       case "break":
         return /* @__PURE__ */ React3.createElement("br", { key });
       case "text":
@@ -456,7 +458,7 @@ import React11 from "react";
 
 // ui/src/Icons.jsx
 import React8 from "react";
-var MagnifyingGlassIcon = (props) => /* @__PURE__ */ React8.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", ...props }, /* @__PURE__ */ React8.createElement("path", { d: "M456.69 421.39L362.6 327.3a173.81 173.81 0 0034.84-104.58C397.44 126.38 319.06 48 222.72 48S48 126.38 48 222.72s78.38 174.72 174.72 174.72A173.81 173.81 0 00327.3 362.6l94.09 94.09a25 25 0 0035.3-35.3zM97.92 222.72a124.8 124.8 0 11124.8 124.8 124.95 124.95 0 01-124.8-124.8z" }));
+var MagnifyingGlassIcon = (props) => /* @__PURE__ */ React8.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", "aria-hidden": "true", focusable: "false", ...props }, /* @__PURE__ */ React8.createElement("path", { d: "M456.69 421.39L362.6 327.3a173.81 173.81 0 0034.84-104.58C397.44 126.38 319.06 48 222.72 48S48 126.38 48 222.72s78.38 174.72 174.72 174.72A173.81 173.81 0 00327.3 362.6l94.09 94.09a25 25 0 0035.3-35.3zM97.92 222.72a124.8 124.8 0 11124.8 124.8 124.95 124.95 0 01-124.8-124.8z" }));
 
 // ui/src/search/SearchPanelForm.jsx
 import React9 from "react";
@@ -595,7 +597,7 @@ function SearchPanelForm(props = {}) {
       onPointerDown: handlePointerDown,
       "data-has-value": hasValue ? "1" : "0"
     },
-    /* @__PURE__ */ React9.createElement("label", { htmlFor: inputId, className: "canopy-search-form__label" }, /* @__PURE__ */ React9.createElement(MagnifyingGlassIcon, { className: "canopy-search-form__icon" }), /* @__PURE__ */ React9.createElement(
+    /* @__PURE__ */ React9.createElement("label", { htmlFor: inputId, className: "canopy-search-form__label" }, /* @__PURE__ */ React9.createElement(MagnifyingGlassIcon, { className: "canopy-search-form__icon" }), /* @__PURE__ */ React9.createElement("span", { className: "sr-only" }, "Search"), /* @__PURE__ */ React9.createElement(
       "input",
       {
         id: inputId,
@@ -605,7 +607,6 @@ function SearchPanelForm(props = {}) {
         "data-canopy-search-form-input": true,
         placeholder,
         className: "canopy-search-form__input",
-        "aria-label": "Search",
         ref: inputRef,
         onChange: handleInputChange,
         onInput: handleInputChange
@@ -1056,7 +1057,15 @@ function CanopyHeader(props = {}) {
         className: "canopy-nav-links canopy-header__desktop-nav",
         "aria-label": "Primary navigation"
       },
-      navLinks.map((link) => /* @__PURE__ */ React14.createElement("a", { key: link.href, href: link.href }, link.label || link.href))
+      navLinks.map((link) => /* @__PURE__ */ React14.createElement(
+        "a",
+        {
+          key: link.href,
+          href: link.href,
+          "aria-current": link.isActive ? "page" : void 0
+        },
+        link.label || link.href
+      ))
     ),
     /* @__PURE__ */ React14.createElement("div", { className: "canopy-header__actions" }, /* @__PURE__ */ React14.createElement(
       "button",
@@ -1135,7 +1144,15 @@ function CanopyHeader(props = {}) {
         className: "canopy-nav-links canopy-modal__nav",
         "aria-label": "Primary navigation"
       },
-      navLinks.map((link) => /* @__PURE__ */ React14.createElement("a", { key: link.href, href: link.href }, link.label || link.href))
+      navLinks.map((link) => /* @__PURE__ */ React14.createElement(
+        "a",
+        {
+          key: link.href,
+          href: link.href,
+          "aria-current": link.isActive ? "page" : void 0
+        },
+        link.label || link.href
+      ))
     ),
     hasSectionNav ? /* @__PURE__ */ React14.createElement(
       "nav",
@@ -1212,6 +1229,7 @@ function TeaserCard({
       {
         src: thumbnail,
         alt: "",
+        "aria-hidden": "true",
         loading: "lazy",
         className: "canopy-search-teaser__thumb-img"
       }
@@ -1688,7 +1706,7 @@ function SearchResults({
   const FigureTemplate = templates && templates.figure ? templates.figure : DefaultFigureTemplate;
   const ArticleTemplate = templates && templates.article ? templates.article : DefaultArticleTemplate;
   if (isAnnotationView) {
-    return /* @__PURE__ */ React28.createElement("div", { id: "search-results", className: "space-y-4" }, results.map((r, i) => {
+    return /* @__PURE__ */ React28.createElement("div", { id: "search-results", className: "space-y-4", role: "region", "aria-label": "Search results" }, results.map((r, i) => {
       if (!r) return null;
       return /* @__PURE__ */ React28.createElement(
         ArticleTemplate,
@@ -1708,7 +1726,7 @@ function SearchResults({
     return !isWorkRecord(record) || normalizedType !== "work";
   };
   if (layout === "list") {
-    return /* @__PURE__ */ React28.createElement("div", { id: "search-results", className: "space-y-6" }, results.map((r, i) => {
+    return /* @__PURE__ */ React28.createElement("div", { id: "search-results", className: "space-y-6", role: "region", "aria-label": "Search results" }, results.map((r, i) => {
       if (shouldRenderAsArticle(r)) {
         return /* @__PURE__ */ React28.createElement("div", { key: i, className: `search-result ${r && r.type}` }, /* @__PURE__ */ React28.createElement(ArticleTemplate, { record: r, query, layout }));
       }
@@ -1733,7 +1751,7 @@ function SearchResults({
       );
     }));
   }
-  return /* @__PURE__ */ React28.createElement("div", { id: "search-results" }, /* @__PURE__ */ React28.createElement(Grid, null, results.map((r, i) => {
+  return /* @__PURE__ */ React28.createElement("div", { id: "search-results", role: "region", "aria-label": "Search results" }, /* @__PURE__ */ React28.createElement(Grid, null, results.map((r, i) => {
     if (shouldRenderAsArticle(r)) {
       return /* @__PURE__ */ React28.createElement(GridItem, { key: i, className: `search-result ${r && r.type}` }, /* @__PURE__ */ React28.createElement(ArticleTemplate, { record: r, query, layout }));
     }
@@ -1933,7 +1951,8 @@ function FacetSection({ facet, selected, onToggle }) {
       {
         type: "button",
         onClick: () => setQuickQuery(""),
-        className: "canopy-search-filters__quick-clear"
+        className: "canopy-search-filters__quick-clear",
+        "aria-label": `Clear ${label} filter search`
       },
       "Clear"
     ) : null), hasQuery && !filteredValues.length ? /* @__PURE__ */ React30.createElement("p", { className: "canopy-search-filters__facet-notice" }, "No matches found.") : null, /* @__PURE__ */ React30.createElement("ul", { className: "canopy-search-filters__facet-list" }, filteredValues.map((entry) => {