feat(data-table): allow custom inputName for radio/checkbox (#2087)

Closes #2085

docs/src/COMPONENT_API.json

@@ -2899,6 +2899,18 @@
           "constant": false,
           "reactive": false
         },
+        {
+          "name": "inputName",
+          "kind": "let",
+          "description": "Specify a name attribute for the input elements\nin a selectable data table (radio or checkbox).\nWhen the table is inside a form, this name will\nbe included in the form data on submit.",
+          "type": "string",
+          "value": "\"ccs-\" + Math.random().toString(36)",
+          "isFunction": false,
+          "isFunctionDeclaration": false,
+          "isRequired": false,
+          "constant": false,
+          "reactive": false
+        },
         {
           "name": "zebra",
           "kind": "let",

docs/src/pages/components/DataTable.svx

@@ -1029,10 +1029,18 @@ In the following example, each row in the sortable data table has an overflow me
 
 Set `selectable` to `true` for rows to be multi-selectable.
 
+Bind to `selectedRowIds` to get the ids of the selected rows.
+
+To customize the `input` name for the checkbox, use the `inputName` prop.
+
 <FileSource src="/framed/DataTable/SelectableDataTable" />
 
 ## Batch selection
 
+To enable batch selection, set `batchSelection` to `true`.
+
+This checkbox is used to select all rows. It enters an indeterminate state when some rows are selected.
+
 <FileSource src="/framed/DataTable/DataTableBatchSelection" />
 
 ## Batch selection with initial selected rows
@@ -1051,7 +1059,7 @@ By default, `ToolbarBatchActions` is activated if one or more rows is selected.
 
 Use the `active` prop to control the toolbar. Note that it will still activate if one or more rows are selected.
 
-You can also prevent the default "Cancel" behavior in the dispatched `on:cancel` event.
+You can prevent the default "Cancel" behavior in the dispatched `on:cancel` event.
 
 <FileSource src="/framed/DataTable/DataTableBatchSelectionToolbarControlled" />
 
@@ -1059,6 +1067,10 @@ You can also prevent the default "Cancel" behavior in the dispatched `on:cancel`
 
 Set `radio` to `true` for only one row to be selected at a time.
 
+Bind to `selectedRowIds` to get the ids of the selected rows. Because it's radio selection, `selectedRowIds` will only contain one id.
+
+To customize the `input` name for the radio button, use the `inputName` prop.
+
 <FileSource src="/framed/DataTable/RadioSelectableDataTable" />
 
 ## Non-selectable rows