update api prop name and description

cloudscape-design · Nov 16, 2023 · 0b819b2 · 0b819b2
1 parent a8d1cb9
commit 0b819b2
Show file tree

Hide file tree

Showing 7 changed files with 21 additions and 25 deletions.
diff --git a/pages/table/editable.page.tsx b/pages/table/editable.page.tsx
@@ -263,7 +263,7 @@ const Demo = forwardRef(
         resizableColumns={true}
         ariaLabels={ariaLabels}
         stickyHeader={true}
-        keyboardNavigation={keyboardNavigation}
+        enableKeyboardNavigation={keyboardNavigation}
       />
     );
   }

diff --git a/pages/table/inline-actions.page.tsx b/pages/table/inline-actions.page.tsx
@@ -179,14 +179,14 @@ export default function () {
               header={<Header>Table with single actions</Header>}
               columnDefinitions={columnDefinitionsSingle}
               items={items}
-              keyboardNavigation={keyboardNavigation}
+              enableKeyboardNavigation={keyboardNavigation}
             />
             <Table
               ariaLabels={selectionLabels}
               header={<Header>Table with multiple actions</Header>}
               columnDefinitions={columnDefinitionsMultiple}
               items={items}
-              keyboardNavigation={keyboardNavigation}
+              enableKeyboardNavigation={keyboardNavigation}
             />
             <Table
               ariaLabels={selectionLabels}
@@ -213,21 +213,21 @@ export default function () {
               selectionType="multi"
               columnDefinitions={columnDefinitionsDropdown}
               items={items}
-              keyboardNavigation={keyboardNavigation}
+              enableKeyboardNavigation={keyboardNavigation}
             />
             <Table
               ariaLabels={selectionLabels}
               header={<Header>Table with mixed actions</Header>}
               columnDefinitions={columnDefinitionsMixed}
               items={items}
-              keyboardNavigation={keyboardNavigation}
+              enableKeyboardNavigation={keyboardNavigation}
             />
             <Table
               ariaLabels={selectionLabels}
               header={<Header>Table with only icon actions</Header>}
               columnDefinitions={columnDefinitionsOnlyIcons}
               items={items}
-              keyboardNavigation={keyboardNavigation}
+              enableKeyboardNavigation={keyboardNavigation}
             />
           </SpaceBetween>
         </Box>

diff --git a/pages/table/resizable-columns.page.tsx b/pages/table/resizable-columns.page.tsx
@@ -211,7 +211,7 @@ export default function App() {
           onSortingChange={event => setSorting(event.detail)}
           onColumnWidthsChange={handleWidthChange}
           variant={fullPage ? 'full-page' : undefined}
-          keyboardNavigation={keyboardNavigation}
+          enableKeyboardNavigation={keyboardNavigation}
         />
       </ScreenshotArea>
     </SpaceBetween>

diff --git a/pages/table/sticky-columns.page.tsx b/pages/table/sticky-columns.page.tsx
@@ -19,7 +19,7 @@ type DemoContext = React.Context<
     resizableColumns: boolean;
     stickyHeader: boolean;
     sortingDisabled: boolean;
-    keyboardNavigation: boolean;
+    enableKeyboardNavigation: boolean;
     selectionType: undefined | 'single' | 'multi';
     stickyColumnsFirst: string;
     stickyColumnsLast: string;
@@ -193,9 +193,9 @@ export default () => {
             </Checkbox>
 
             <Checkbox
-              checked={urlParams.keyboardNavigation}
+              checked={urlParams.enableKeyboardNavigation}
               onChange={event => {
-                setUrlParams({ keyboardNavigation: event.detail.checked });
+                setUrlParams({ enableKeyboardNavigation: event.detail.checked });
                 window.location.reload();
               }}
             >

diff --git a/src/__tests__/__snapshots__/documenter.test.ts.snap b/src/__tests__/__snapshots__/documenter.test.ts.snap
@@ -12953,6 +12953,13 @@ Use it in conjunction with the content display preference of the [collection pre
       "optional": true,
       "type": "string",
     },
+    Object {
+      "description": "Use this property to activate advanced keyboard navigation and focusing behaviors.
+When set to \`true\` table cells become navigable with arrow keys and the entire table has a single Tab stop.",
+      "name": "enableKeyboardNavigation",
+      "optional": true,
+      "type": "boolean",
+    },
     Object {
       "description": " Use this property to inform screen readers which range of items is currently displayed in the table.
  It specifies the index (1-based) of the first item in the table.
@@ -12993,12 +13000,6 @@ by the \`cell\` property of each column definition in the \`columnDefinitions\`
       "optional": false,
       "type": "ReadonlyArray<T>",
     },
-    Object {
-      "description": "Experimental API",
-      "name": "keyboardNavigation",
-      "optional": true,
-      "type": "boolean",
-    },
     Object {
       "description": "Renders the table in a loading state. We recommend that you also set a \`loadingText\`.",
       "name": "loading",
@@ -13154,12 +13155,6 @@ Return a promise to keep loading state while the submit request is in progress."
       "optional": true,
       "type": "TableProps.SubmitEditFunction<T>",
     },
-    Object {
-      "description": "Experimental API",
-      "name": "suppressKeyboardNavigationFor",
-      "optional": true,
-      "type": "((element: HTMLElement) => boolean) | string",
-    },
     Object {
       "description": "Use this property to inform screen readers how many items there are in a table.
 It specifies the total count of all items in a table.

diff --git a/src/table/interfaces.tsx b/src/table/interfaces.tsx
@@ -318,9 +318,10 @@ export interface TableProps<T = any> extends BaseComponentProps {
   onEditCancel?: CancelableEventHandler;
 
   /**
-   * Experimental API
+   * Use this property to activate advanced keyboard navigation and focusing behaviors.
+   * When set to `true` table cells become navigable with arrow keys and the entire table has a single Tab stop.
    */
-  keyboardNavigation?: boolean;
+  enableKeyboardNavigation?: boolean;
 }
 
 export namespace TableProps {

diff --git a/src/table/internal.tsx b/src/table/internal.tsx
@@ -106,7 +106,7 @@ const InternalTable = React.forwardRef(
       renderAriaLive,
       stickyColumns,
       columnDisplay,
-      keyboardNavigation,
+      enableKeyboardNavigation: keyboardNavigation,
       __funnelSubStepProps,
       ...rest
     }: InternalTableProps<T>,