Add tabindex="-1" to right arrow icons in EditableTable component snapshots for accessibility improvements

Author: chenshuai2144

packages/field/src/components/Select/index.tsx

@@ -259,19 +259,22 @@ export const useFieldFetchData = (
       let i = 0;
       while (i < length) {
         const cur = _options[i++];
-        if (cur[children] || cur[label] || cur[value]) {
-          cur[type] =
-            cur[
-              type === 'children' ? children : type === 'label' ? label : value
-            ];
-          traverseFieldKey(cur[children], type);
+        const customFieldName =
+          type === 'children' ? children : type === 'label' ? label : value;
+        if (customFieldName && cur[customFieldName] !== undefined) {
+          cur[type] = cur[customFieldName];
+          if (type === 'children') {
+            traverseFieldKey(cur[customFieldName], 'children');
+            traverseFieldKey(cur[customFieldName], 'label');
+            traverseFieldKey(cur[customFieldName], 'value');
+          }
         }
       }
     };
 
     if (children) traverseFieldKey(data, 'children');
     if (label) traverseFieldKey(data, 'label');
-    if (value) traverseFieldKey(data, 'value');    
+    if (value) traverseFieldKey(data, 'value');
     return data;
   }, [fieldProps]);
 
@@ -375,7 +378,8 @@ export const useFieldFetchData = (
   const applyFieldNamesMapping = (item: any) => {
     if (!fieldProps?.fieldNames) return item;
 
-    const { label: labelKey = 'label', value: valueKey = 'value' } = fieldProps.fieldNames;
+    const { label: labelKey = 'label', value: valueKey = 'value' } =
+      fieldProps.fieldNames;
 
     return {
       ...item,
@@ -450,6 +454,16 @@ const FieldSelect: ProFieldFC<
   const optionsValueEnum = useMemo(() => {
     if (mode !== 'read') return;
 
+    /**
+     * Support select fieldNames
+     * Similar to cascader fieldNames support
+     */
+    const {
+      value: valuePropsName = 'value',
+      label: labelPropsName = 'label',
+      options: optionsPropsName = 'options',
+    } = fieldProps?.fieldNames || {};
+
     const traverseOptions = (_options: typeof options) => {
       const localMap = new Map();
 
@@ -461,12 +475,18 @@ const FieldSelect: ProFieldFC<
       for (let i = 0; i < length; i++) {
         const cur = _options[i];
 
-        if (cur.value !== undefined && cur.label !== undefined) {
-          localMap.set(cur.value, cur.label);
+        // Use fieldNames mapping to get correct value and label
+        const curValue = cur[valuePropsName];
+        const curLabel = cur[labelPropsName];
+
+        if (curValue !== undefined && curLabel !== undefined) {
+          localMap.set(curValue, curLabel);
         }
 
-        if (cur.options?.length) {
-          const childMap = traverseOptions(cur.options);
+        // Handle nested options with fieldNames mapping
+        const childOptions = cur[optionsPropsName] || cur.options;
+        if (childOptions?.length) {
+          const childMap = traverseOptions(childOptions);
           childMap.forEach((v, k) => localMap.set(k, v));
         }
       }
@@ -475,7 +495,7 @@ const FieldSelect: ProFieldFC<
     };
 
     return traverseOptions(options);
-  }, [mode, options]);
+  }, [mode, options, fieldProps?.fieldNames]);
 
   if (mode === 'read') {
     const dom = (

tests/card/__snapshots__/demo.test.ts.snap

@@ -7541,6 +7541,57 @@ exports[`card demos > 📸 renders ./packages/card/src/demos/collapsible.tsx cor
               aria-label="right"
               class="anticon anticon-right ant-pro-card-collapsible-icon"
               role="img"
+              tabindex="-1"
+            >
+              <svg
+                aria-hidden="true"
+                data-icon="right"
+                fill="currentColor"
+                focusable="false"
+                height="1em"
+                viewBox="64 64 896 896"
+                width="1em"
+              >
+                <path
+                  d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"
+                />
+              </svg>
+            </span>
+            Collapsible
+          </div>
+          <div
+            class="ant-pro-card-extra"
+          >
+            <button
+              class="ant-btn ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-sm"
+              type="button"
+            >
+              <span>
+                Submit
+              </span>
+            </button>
+          </div>
+        </div>
+        <div
+          class="ant-pro-card-body"
+        >
+          Content
+        </div>
+      </div>
+      <div
+        class="ant-pro-card ant-pro-card-collapse"
+      >
+        <div
+          class="ant-pro-card-header ant-pro-card-header-border ant-pro-card-header-collapsible"
+        >
+          <div
+            class="ant-pro-card-title"
+          >
+            <span
+              aria-label="right"
+              class="anticon anticon-right ant-pro-card-collapsible-icon"
+              role="img"
+              tabindex="-1"
             >
               <svg
                 aria-hidden="true"
@@ -7590,6 +7641,7 @@ exports[`card demos > 📸 renders ./packages/card/src/demos/collapsible.tsx cor
               aria-label="right"
               class="anticon anticon-right ant-pro-card-collapsible-icon"
               role="img"
+              tabindex="-1"
             >
               <svg
                 aria-hidden="true"
@@ -7639,6 +7691,7 @@ exports[`card demos > 📸 renders ./packages/card/src/demos/collapsible.tsx cor
               aria-label="right"
               class="anticon anticon-right ant-pro-card-collapsible-icon"
               role="img"
+              tabindex="-1"
             >
               <svg
                 aria-hidden="true"
@@ -8166,6 +8219,7 @@ exports[`card demos > 📸 renders ./packages/card/src/demos/group.tsx correctly
             aria-label="right"
             class="anticon anticon-right ant-pro-card-collapsible-icon"
             role="img"
+            tabindex="-1"
           >
             <svg
               aria-hidden="true"