[Multiple components] Miscellaneous doc updates

This PR closes out all current doc change requests.

Closes #10181

COPYBARA_INTEGRATE_REVIEW=#10181 from andrewoverton:dev-docs-03-15-cherry-pick 00414a4
PiperOrigin-RevId: 363178361

Author: andrewoverton

components/BottomSheet/README.md

@@ -68,20 +68,16 @@ As a user of the bottom sheet component, it is up to you to determine that its c
 
 We recommend giving all of these properties appropriate values for your use case.
 
-## Types
+**Types**
 
 There are three types suitable for different use cases:
-1. [Standard bottom sheets](#standard-bottom-sheet) display content that complements the screen’s primary content and remain visible while users interact with the primary content
+1. Standard bottom sheets display content that complements the screen’s primary content and remain visible while users interact with the primary content
 1. [Modal bottom sheets](#modal-bottom-sheet) are an alternative to inline menus or simple dialogs on mobile and provide room for additional items, longer descriptions, and iconography, and must be dismissed in order to interact with the underlying content
 1. [Expanding bottom sheets](#expanding-bottom-sheet) provide a small, collapsed surface that can be expanded by the user to access a key feature or task to offer the persistent access of a standard sheet with the space and focus of a modal sheet.
 
 ![Composite image of bottom sheet types](docs/assets/bottom-sheet-types.png)
 
-## Standard bottom sheet
-
-Standard bottom sheets coexist with the screen’s main UI region and allow for simultaneously viewing and interacting with both regions. They are commonly used to keep a feature or secondary content visible on screen when content in main UI region is frequently scrolled or panned.
-
-There is no standard bottom sheet implementation on iOS. This is because the iOS bottom sheet implementation makes use of custom view controller transitions, which do not allow interaction with the presenting view controller, even when the presented view controller does not take up the whole screen. 
+_**Note:** Standard bottom sheets aren't supported on iOS. This is because the iOS bottom sheet implementation makes use of custom view controller transitions, which do not allow interaction with the presenting view controller, even when the presented view controller does not take up the whole screen._
 
 ## Modal bottom sheet
 

components/Buttons/docs/buttons.md

@@ -160,9 +160,9 @@ repeats weekly on the following day(s)." The list items do not need
 (representing a day of the week) has the `accessibilityHint` value, "Toggles
 this day."
 
-## Types
+**Types**
 
-There are four types of buttons: 1. [Text button](#text-button) 2. [Outlined button](#outlined-button) 3. [Contained button](#contained-button) 4. Toggle button (*not supported in iOS*)"
+There are four types of buttons: 1\. [Text button](#text-button) 2\. [Outlined button](#outlined-button) 3\. [Contained button](#contained-button) 4\. Toggle button (*not supported in iOS*)"
 
 ![Example of the four button types](assets/buttons_types.png)
 

components/Buttons/docs/fabs.md

@@ -140,7 +140,7 @@ repeats weekly on the following day(s)." The list items do not need
 (representing a day of the week) has the `accessibilityHint` value, "Toggles
 this day."
 
-## Types
+**Types**
 
 There are three types of FABs: 1\. [Regular FABs](#regular-fab) 2\. [Mini FABs](#mini-fab) 3\. [Extended FABs](#extended-fab)
 

components/Chips/README.md

@@ -67,14 +67,9 @@ Always verify that your chips meet minimum touch requirements, as defined by eit
 
 Remember to set any relevant `accessibilityLabels` or `accessibilityTraits`, especially if you are not satisfied with default system-assigned values.
 
-## Types
+**Types**
 
-There are four types of chips:
-
-1. [Input (text entry)](#input-chip)
-1. [Choice](#choice-chip)
-1. [Filter](#filter-chip)
-1. [Action](#action-chip)
+There are four types of chips: 1\. [Input (text entry)](#input-chip) 2\. [Choice](#choice-chip) 3\. [Filter](#filter-chip) 4\. [Action](#action-chip)
 
 ![Examples of the four different chip types](docs/assets/chips-composite.png)
 
@@ -92,7 +87,6 @@ self.view.addSubview(chipView)
 ```
 
 #### Objective-C
-
 ```objc
 MDCChipView *chipView = [[MDCChipView alloc] init];
 chipView.titleLabel.text = @"Tap me";
@@ -156,6 +150,18 @@ Input chips represent a complex piece of information in compact form, such as an
 
 We currently provide an implementation of Input Chips called `MDCChipField`.
 
+<!--<div class="material-code-render" markdown="1">-->
+#### Swift
+```swift
+let chipField = MDCChipField()
+chipField.delegate = self
+chipField.textField.placeholderLabel.text = "This is a chip field."
+chipField.showChipsDeleteButton = true
+chipField.sizeToFit()
+view.addSubview(chipField)
+```
+
+#### Objective-C
 ```objc
 MDCChipField *chipField = [[MDCChipField alloc] init];
 chipField.delegate = self;
@@ -176,33 +182,60 @@ It is easiest to create choice Chips using a `UICollectionView`:
 - Use `MDCChipCollectionViewFlowLayout` as the `UICollectionView` layout:
 
 <!--<div class="material-code-render" markdown="1">-->
+#### Swift
+```swift
+let layout = MDCChipCollectionViewFlowLayout()
+collectionView = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout)
+```
+
+#### Objective-C
 ```objc
 MDCChipCollectionViewFlowLayout *layout = [[MDCChipCollectionViewFlowLayout alloc] init];
 _collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:layout];
 ```
 <!--</div>-->
 
 - Leave the default `UICollectionView` selection setting (single selection).
-
 - Use `MDCChipCollectionViewCell` as `UICollectionView` cells. (`MDCChipCollectionViewCell` manages the state of the chip based on selection state of `UICollectionView` automatically)
 
 <!--<div class="material-code-render" markdown="1">-->
+#### Swift
+```swift
+func loadView() {
+  super.loadView()
+
+  collectionView.register(
+      MDCChipCollectionViewCell.self,
+      forCellWithReuseIdentifier: "identifier")
+}
+
+func collectionView(
+  _ collectionView: UICollectionView,
+  cellForItemAt indexPath: IndexPath
+) -> UICollectionViewCell {
+  let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "identifier", for: indexPath) as! MDCChipCollectionViewCell
+  let chipView = cell.chipView
+  // configure the chipView to be a choice chip
+  return cell
+}
+```
+
+#### Objective-C
 ```objc
 - (void)loadView {
   [super loadView];
-  …
+
   [_collectionView registerClass:[MDCChipCollectionViewCell class]
       forCellWithReuseIdentifier:@"identifier"];
-  ...
- }
+}
 
 - (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
                            cellForItemAtIndexPath:(NSIndexPath *)indexPath {
   MDCChipCollectionViewCell *cell =
       [collectionView dequeueReusableCellWithReuseIdentifier:@"identifier" forIndexPath:indexPath];
   MDCChipView *chipView = cell.chipView;
-  // configure the chipView
-   return cell;
+  // configure the chipView to be a choice chip
+  return cell;
 }
 ```
 <!--</div>-->
@@ -222,6 +255,13 @@ It is easiest to create filter Chips using a `UICollectionView`:
 - Use `MDCChipCollectionViewFlowLayout` as the `UICollectionView` layout:
 
 <!--<div class="material-code-render" markdown="1">-->
+#### Swift
+```swift
+let layout = MDCChipCollectionViewFlowLayout()
+collectionView = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout)
+```
+
+#### Objective-C
 ```objc
 MDCChipCollectionViewFlowLayout *layout = [[MDCChipCollectionViewFlowLayout alloc] init];
 _collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:layout];
@@ -231,30 +271,57 @@ _collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionV
 - Allow multi cell selection in the `UICollectionView`:
 
 <!--<div class="material-code-render" markdown="1">-->
+#### Swift
+```swift
+collectionView.allowsMultipleSelection = true
+```
+
+#### Objective-C
 ```objc
-collectionView.allowsMultipleSelection = YES; 
+collectionView.allowsMultipleSelection = YES;
 ```
 <!--</div>-->
 
 - Use `MDCChipCollectionViewCell` as `UICollectionView` cells. (`MDCChipCollectionViewCell` manages the state of the chip based on selection state of `UICollectionView` automatically)
 
 <!--<div class="material-code-render" markdown="1">-->
+#### Swift
+```swift
+func loadView() {
+  super.loadView()
+
+  collectionView.register(
+      MDCChipCollectionViewCell.self,
+      forCellWithReuseIdentifier: "identifier")
+}
+
+func collectionView(
+    _ collectionView: UICollectionView,
+    cellForItemAt indexPath: IndexPath
+) -> UICollectionViewCell {
+    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "identifier", for: indexPath) as! MDCChipCollectionViewCell
+    let chipView = cell.chipView
+    // configure the chipView to be a filter chip
+    return cell
+}
+```
+
+#### Objective-C
 ```objc
 - (void)loadView {
   [super loadView];
-  …
+
   [_collectionView registerClass:[MDCChipCollectionViewCell class]
       forCellWithReuseIdentifier:@"identifier"];
-  ...
- }
+}
 
 - (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
                            cellForItemAtIndexPath:(NSIndexPath *)indexPath {
   MDCChipCollectionViewCell *cell =
       [collectionView dequeueReusableCellWithReuseIdentifier:@"identifier" forIndexPath:indexPath];
   MDCChipView *chipView = cell.chipView;
-  // configure the chipView
-   return cell;
+  // configure the chipView to be a filter chip
+  return cell;
 }
 ```
 <!--</div>-->
@@ -274,6 +341,13 @@ It is easiest to create action Chips using a `UICollectionView`:
 - Use `MDCChipCollectionViewFlowLayout` as the `UICollectionView` layout:
 
 <!--<div class="material-code-render" markdown="1">-->
+#### Swift
+```swift
+let layout = MDCChipCollectionViewFlowLayout()
+collectionView = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout)
+```
+
+#### Objective-C
 ```objc
 MDCChipCollectionViewFlowLayout *layout = [[MDCChipCollectionViewFlowLayout alloc] init];
 _collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:layout];
@@ -284,29 +358,62 @@ _collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionV
 - Use `MDCChipCollectionViewCell` as `UICollectionView` cells. (`MDCChipCollectionViewCell` manages the state of the chip based on selection state of `UICollectionView` automatically)
 
 <!--<div class="material-code-render" markdown="1">-->
+#### Swift
+```swift
+func loadView() {
+  super.loadView()
+
+  collectionView.register(
+      MDCChipCollectionViewCell.self,
+      forCellWithReuseIdentifier: "identifier")
+}
+
+func collectionView(
+  _ collectionView: UICollectionView,
+  cellForItemAt indexPath: IndexPath
+) -> UICollectionViewCell {
+  let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "identifier", for: indexPath) as! MDCChipCollectionViewCell
+  let chipView = cell.chipView
+  // configure the chipView to be an action chip
+  return cell
+}
+```
+
+#### Objective-C
 ```objc
 - (void)loadView {
   [super loadView];
-  …
+
   [_collectionView registerClass:[MDCChipCollectionViewCell class]
       forCellWithReuseIdentifier:@"identifier"];
-  ...
- }
+}
 
 - (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
                            cellForItemAtIndexPath:(NSIndexPath *)indexPath {
   MDCChipCollectionViewCell *cell =
       [collectionView dequeueReusableCellWithReuseIdentifier:@"identifier" forIndexPath:indexPath];
   MDCChipView *chipView = cell.chipView;
-  // configure the chipView
-   return cell;
+  // configure the chipView to be an action chip
+  return cell;
 }
 ```
 <!--</div>-->
 
 - Make sure that `MDCChipCollectionViewCell` does not stay in selected state
 
 <!--<div class="material-code-render" markdown="1">-->
+#### Swift
+```swift
+func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
+  // For action chips, we never want the chip to stay in selected state.
+  // Other possible apporaches would be relying on theming or Customizing collectionViewCell
+  // selected state.
+  collectionView.deselectItem(at: indexPath, animated: false)
+  // Trigger the action
+}
+```
+
+#### Objective-C
 ```objc
 - (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
   // For action chips, we never want the chip to stay in selected state.

components/List/README.md

@@ -155,16 +155,13 @@ An instance of `MDCSelfSizingStereoCell` can be configured to be a single-line,
 **Title text**            |`titleLabel`                             | N/A                           | N/A
 **Detail text**            |`titleLabel`                              | N/A                          | N/A
 
-## Types
+**Types**
 
-There are three list types:
-1. [Single-line list](#single-line-list)
-1. [Two-line list](#two-line-list)
-1. [Three-line list](#three-line-list)
+There are three list types: 1\. [Single-line list](#single-line-list), 2\. [Two-line list](#two-line-list) 3\. [Three-line list](#three-line-list)
 
 ![Composite image of the three list types](docs/assets/lists-types.png)
 
-### Single-line list
+## Single-line list
 
 Single-line list items contain a maximum of one line of text.
 
@@ -202,7 +199,7 @@ func collectionView(_ collectionView: UICollectionView,
 ```
 <!--</div>-->
 
-### Two-line list
+## Two-line list
 
 Two-line list items contain a maximum of two lines of text.
 
@@ -242,7 +239,7 @@ func collectionView(_ collectionView: UICollectionView,
 ```
 <!--</div>-->
 
-### Three-line list
+## Three-line list
 
 Three-line list items contains a maximum of three lines of text.
 

components/NavigationDrawer/README.md

@@ -61,12 +61,10 @@ import MaterialComponents.MaterialNavigationDrawer
 
 While `MDCBottomDrawerViewController` supports the accessibility escape "Z" gesture, it is advisible that the content view controller provides its own dismiss action affordance. Note that it is the responsibility of the header and content view controllers to implement any custom accessibility behavior.
 
-## Types
+## Bottom navigation drawer
 
 Both bottom navigation drawers and side navigation drawers exist, but we only offer a bottom navigation drawer implementation.
 
-## Bottom navigation drawer
-
 Our bottom navigation drawer implementation is centered around `MDCBottomDrawerViewController`, a `UIViewController` subclass. `MDCBottomDrawerViewController` has a `contentViewController` property, whose view is displayed as the primary content of the drawer, as well as a `headerViewController` property, whose view is positioned above the content view controller and sticks to the top when the drawer is full-screen. For more information on implementing custom view controller classes see [Apple's View Controller Programming Guide](https://developer.apple.com/library/archive/featuredarticles/ViewControllerPGforiPhoneOS/DefiningYourSubclass.html#//apple_ref/doc/uid/TP40007457-CH7-SW1).
 
 Bottom navigation drawers are recommended for: