@plone/volto 17.21.0 → 17.22.1

package/CHANGELOG.md

@@ -17,6 +17,23 @@ myst:
 
 <!-- towncrier release notes start -->
 
+## 17.22.1 (2025-08-25)
+
+### Bugfix
+
+- fix(fetchContent): correctly handle undefined blocksType in async fetchContent @nileshgulia1 [#7112](https://github.com/plone/volto/issues/7112)
+- Fix corner case in devproxy when pathname is null. @sneridagh [#7276](https://github.com/plone/volto/issues/7276)
+
+## 17.22.0 (2025-05-20)
+
+### Feature
+
+- Use table sorting icons from pastanaga `icons.woff` instead of assuming we have Font Awesome icons. Improve accessibility for sortable table headers in table block. @ichim-david @kreafox [#7091](https://github.com/plone/volto/issues/7091)
+
+### Bugfix
+
+- Added an `aria-label` to `CreatableSelect` inside `TokenWidget` to improve the component’s accessibility. @Wagner3UB [#6786](https://github.com/plone/volto/issues/6786)
+
 ## 17.21.0 (2025-03-05)
 
 ### Feature

package/package.json

@@ -9,7 +9,7 @@
     }
   ],
   "license": "MIT",
-  "version": "17.21.0",
+  "version": "17.22.1",
   "repository": {
     "type": "git",
     "url": "git@github.com:plone/volto.git"

package/packages/volto-slate/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plone/volto-slate",
-  "version": "17.21.0",
+  "version": "17.22.1",
   "description": "Slate.js integration with Volto",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

package/packages/volto-slate/src/blocks/Table/TableBlockView.jsx

@@ -71,6 +71,19 @@ const View = ({ data }) => {
     });
   }, [state, rows]);
 
+  const handleSort = (index) => {
+    if (!data.table.sortable) return;
+    setState({
+      column: index,
+      direction:
+        state.column !== index
+          ? 'ascending'
+          : state.direction === 'ascending'
+            ? 'descending'
+            : 'ascending',
+    });
+  };
+  
   return (
     <>
       {data && data.table && (
@@ -92,19 +105,20 @@ const View = ({ data }) => {
                     key={cell.key}
                     textAlign="left"
                     verticalAlign="middle"
+                    tabIndex={data.table.sortable ? '0' : '-1'}
                     sorted={state.column === index ? state.direction : null}
                     onClick={() => {
-                      if (!data.table.sortable) return;
-                      setState({
-                        column: index,
-                        direction:
-                          state.column !== index
-                            ? 'ascending'
-                            : state.direction === 'ascending'
-                            ? 'descending'
-                            : 'ascending',
-                      });
+                      handleSort(index);
+                    }}
+                    onKeyDown={(e) => {
+                      if (e.key === 'Enter' || e.key === ' ') {
+                        e.preventDefault();
+                        handleSort(index);
+                      }
                     }}
+                    aria-sort={
+                      state.column === index ? state.direction : 'none'
+                    }
                   >
                     {cell.value &&
                     Node.string({ children: cell.value }).length > 0

package/src/components/manage/Widgets/TokenWidget.jsx

@@ -173,6 +173,7 @@ class TokenWidget extends Component {
       <FormFieldWrapper {...this.props}>
         <CreatableSelect
           id={`field-${this.props.id}`}
+          aria-labelledby={`fieldset-${this.props.fieldSet}-field-label-${this.props.id}`}
           key={this.props.id}
           menuShouldScrollIntoView={false}
           isDisabled={this.props.isDisabled}

package/src/components/theme/App/App.jsx

@@ -232,7 +232,9 @@ export const fetchContent = async ({ store, location }) => {
 
   const visitor = ([id, data]) => {
     const blockType = data['@type'];
-    const { getAsyncData } = blocksConfig[blockType];
+    const block = blocksConfig[blockType];
+    if (!block) return;
+    const { getAsyncData } = block;
     if (getAsyncData) {
       const p = getAsyncData({
         store,

package/src/express-middleware/devproxy.js

@@ -10,8 +10,13 @@ import querystring from 'querystring';
 import { parse as parseUrl } from 'url';
 
 const filter = function (pathname, req) {
-  // This is the proxy to the API in case the accept header is 'application/json'
-  return config.settings.devProxyToApiPath && pathname.startsWith('/++api++');
+  // Check if pathname is defined, there are some corner cases that pathname is null
+  if (pathname) {
+    // This is the proxy to the API in case the accept header is 'application/json'
+    return config.settings.devProxyToApiPath && pathname.startsWith('/++api++');
+  } else {
+    return false;
+  }
 };
 
 let _env = null;

package/theme/themes/pastanaga/collections/table.overrides

@@ -19,6 +19,15 @@
   vertical-align: @headerVerticalAlign;
 }
 
+// use sorting icons from icons.woff instead of assuming it's font awesome
+.ui.sortable.table thead th.ascending::after {
+  content: '\E9EC';
+}
+
+.ui.sortable.table thead th.descending::after {
+  content: '\E9EB';
+}
+
 .ui.table tr > th:first-child {
   border-left: none;
 }