@telus-uds/components-base 1.7.1 → 1.8.2

package/component-docs.json

@@ -36,6 +36,7 @@
       },
       "ButtonGroup": {
         "space": "integer",
+        "fieldSpace": "integer",
         "direction": "direction",
         "alignItems": "flexAlign",
         "justifyContent": "flexJustifyContent",
@@ -748,6 +749,7 @@
       },
       "ToggleSwitchGroup": {
         "space": "integer",
+        "fieldSpace": "integer",
         "direction": "direction",
         "alignItems": "flexAlign",
         "justifyContent": "flexJustifyContent",
@@ -1548,6 +1550,23 @@
     }
   },
   "components": {
+    "A11yInfoProvider": {
+      "docs": {
+        "description": "",
+        "props": {
+          "children": {
+            "type": {
+              "name": "node"
+            },
+            "required": true,
+            "description": ""
+          }
+        },
+        "attributes": {
+          "acceptsRNA11yProps": false
+        }
+      }
+    },
     "A11yText": {
       "docs": {
         "description": "A11yText is a zero-size invisible element that adds text to be read by screen readers.\n\nIt should be used to add selectable screen-reader-only text to the main document flow,\nas a sibling to blocks of text like paragraphs and interactive elements like buttons.",
@@ -1572,6 +1591,233 @@
         }
       }
     },
+    "Accordion": {
+      "docs": {
+        "description": "'Accordion' is a shorthand for an ExpandCollapse where only one item may be open at a time",
+        "props": {
+          "variant": {
+            "type": {
+              "name": "objectOf",
+              "value": {
+                "name": "union",
+                "value": [
+                  {
+                    "name": "string"
+                  },
+                  {
+                    "name": "number"
+                  },
+                  {
+                    "name": "bool"
+                  }
+                ]
+              }
+            },
+            "required": false,
+            "description": ""
+          },
+          "tokens": {
+            "type": {
+              "name": "custom",
+              "raw": {
+                "borderColor": "color",
+                "borderWidth": "border",
+                "borderStyle": "borderStyle"
+              }
+            },
+            "required": false,
+            "description": ""
+          },
+          "children": {
+            "type": {
+              "name": "union",
+              "value": [
+                {
+                  "name": "func"
+                },
+                {
+                  "name": "node"
+                }
+              ]
+            },
+            "required": true,
+            "description": "ExpandCollapse usually takes a render function to which it passes an object with properties\n{ openIds, onToggle, resetValues, setValues, unsetValues }. openIds (array of ids) and\nonToggle (function) will usually be passed to `<ExpandCollapse.Panel>`"
+          },
+          "maxOpen": {
+            "type": {
+              "name": "number"
+            },
+            "required": false,
+            "description": "If set, enforces a specific maximum number of open items, closing already-open items when new\nitems are opened. By default, any number of items may be open at once."
+          },
+          "open": {
+            "type": {
+              "name": "arrayOf",
+              "value": {
+                "name": "string"
+              }
+            },
+            "required": false,
+            "description": "If passed, the item or items that are expanded will be controlled by a parent component"
+          },
+          "onChange": {
+            "type": {
+              "name": "func"
+            },
+            "required": false,
+            "description": "Function called when which panels are currently open changes. Necessary if `open` is passed."
+          },
+          "initialOpen": {
+            "type": {
+              "name": "arrayOf",
+              "value": {
+                "name": "string"
+              }
+            },
+            "required": false,
+            "description": "Allows items with specified ids to be open by default on first load. Should not be used with `open`."
+          }
+        },
+        "attributes": {
+          "acceptsRNA11yProps": false
+        }
+      },
+      "Panel": {
+        "docs": {
+          "description": "An item in an `ExpandCollapse` which contains collapsible `children` and a `control` that opens\nand closes the collapsible children when pressed.\n\nExpects `openIds` and `onToggle` props from the `ExpandCollapse` render function and a unique\n`panelId` that matches the ids passed to the `<ExpandCollapse>`.\n\nThe panel does not need to be a direct child of the `<ExpandCollapse>` (unless this is required\nby the chosen accessibility props for a particular accessibility tools).",
+          "props": {
+            "openIds": {
+              "defaultValue": {
+                "value": "[]",
+                "computed": false
+              },
+              "type": {
+                "name": "arrayOf",
+                "value": {
+                  "name": "union",
+                  "value": [
+                    {
+                      "name": "number"
+                    },
+                    {
+                      "name": "string"
+                    }
+                  ]
+                }
+              },
+              "required": false,
+              "description": "Array of the ids of currently open groups"
+            },
+            "variant": {
+              "type": {
+                "name": "objectOf",
+                "value": {
+                  "name": "union",
+                  "value": [
+                    {
+                      "name": "string"
+                    },
+                    {
+                      "name": "number"
+                    },
+                    {
+                      "name": "bool"
+                    }
+                  ]
+                }
+              },
+              "required": false,
+              "description": ""
+            },
+            "tokens": {
+              "type": {
+                "name": "custom",
+                "raw": {
+                  "expandDuration": "duration",
+                  "collapseDuration": "duration",
+                  "contentPaddingLeft": "size",
+                  "contentPaddingRight": "size",
+                  "contentPaddingTop": "size",
+                  "contentPaddingBottom": "size"
+                }
+              },
+              "required": false,
+              "description": ""
+            },
+            "panelId": {
+              "type": {
+                "name": "string"
+              },
+              "required": true,
+              "description": "Unique name by which the ExpandCollapse controls this element."
+            },
+            "onToggle": {
+              "type": {
+                "name": "func"
+              },
+              "required": true,
+              "description": "Function to call on pressing the panel's control, which should open or close the panel.\nIf Panel is a direct child of `ExpandCollapse`, this prop will be provided by the ExpandCollapse parent."
+            },
+            "onPress": {
+              "type": {
+                "name": "func"
+              },
+              "required": false,
+              "description": "Optional function to call on pressing the panel's control, in addition to opening or closing the panel."
+            },
+            "children": {
+              "type": {
+                "name": "union",
+                "value": [
+                  {
+                    "name": "func"
+                  },
+                  {
+                    "name": "node"
+                  }
+                ]
+              },
+              "required": false,
+              "description": "ExpandCollapsePanel's children are the content that is hidden or revealed on open or close, and may be any\nsingle React element or a render function which takes this group's isExpanded state, onToggle function and panelId"
+            },
+            "control": {
+              "type": {
+                "name": "custom",
+                "raw": "ExpandCollapseControl.propTypes.children.isRequired"
+              },
+              "required": false,
+              "description": "The content inside the always-visible control element that opens and closes the ExpandCollapse when pressed."
+            },
+            "controlTokens": {
+              "type": {
+                "name": "custom",
+                "raw": {
+                  "icon": "icon",
+                  "iconColor": "color",
+                  "iconSize": "size",
+                  "iconGap": "size",
+                  "iconPosition": "position",
+                  "verticalAlign": "verticalAlign",
+                  "justifyContent": "flexJustifyContent",
+                  "paddingLeft": "size",
+                  "paddingRight": "size",
+                  "paddingTop": "size",
+                  "paddingBottom": "size",
+                  "borderWidth": "border",
+                  "borderColor": "color",
+                  "backgroundColor": "color"
+                }
+              },
+              "required": false,
+              "description": "Optional theme token overrides that may be passed to the ExpandCollapseControl element."
+            }
+          },
+          "attributes": {
+            "acceptsRNA11yProps": false
+          }
+        }
+      }
+    },
     "ActivityIndicator": {
       "docs": {
         "description": "`ActivityIndicator` renders a visual loading state.\nIt does not handle positioning or layout of that visual loader.",
@@ -1622,6 +1868,31 @@
         }
       }
     },
+    "BaseProvider": {
+      "docs": {
+        "description": "",
+        "props": {
+          "defaultTheme": {
+            "type": {
+              "name": "custom",
+              "raw": "ThemeProvider.propTypes?.defaultTheme"
+            },
+            "required": false,
+            "description": ""
+          },
+          "children": {
+            "type": {
+              "name": "node"
+            },
+            "required": true,
+            "description": ""
+          }
+        },
+        "attributes": {
+          "acceptsRNA11yProps": false
+        }
+      }
+    },
     "Box": {
       "docs": {
         "description": "A layout utility component. Use Box to create space (padding) around content.\n\n## Spacing\n\nFor most simple uses, pass a number to Box's `space` prop referring to an index in the theme's\nspacing scale. For example, for a box with the theme's smallest non-zero amount of padding on all sides:\n\n```jsx\n<Box space={1}>\n```\n\n#### Targetting specific sides\n\nBox allows spacing value props to be assigned to any side or all sides using the following props:\n\n- `space` sets the default for all sides, which is overridden by other props below\n- `horizontal` sets defaults for `left` and `right` (overriding `space` there if it is set)\n- `vertical` sets defaults for `top` and `bottom` (overriding `space` there if it is set)\n- `left` sets the left side padding, inside the box's bounds\n- `right` sets the right side padding, inside the box's bounds\n- `top` sets the top side padding, inside the box's bounds\n- `bottom` sets the bottom side padding, inside the box's bounds\n\nBox only controls spacing within its bounds. If space is needed around a box outside of its bounds,\nuse `Spacer`, `StackView` or wrap the `Box` inside another `Box`.\n\n#### Viewport-specific spacing\n\nResponsive behaviours may be set by passing any of the above props an object keyed by viewports.\n\nFor example, if a theme's spacing scale is [0, 4, 8...], this below will have padding of 4px on top,\nbottom, and right, and its left padding will be 0px on xs, sm and md viewports and 8px on lg and xl viewports:\n\n```jsx\n<Box space={1} left={{ xs: 0, lg: 2 }} />`\n```\n\n#### Subtracting from spacing\n\nA parent may sometimes need to reduce the spacing size on one or more sides of a `Box` by some variable.\nFor example, the parent may have a border on one side and want to reduce the spacing of a child box\nby the width of that border on that side. This can be achieved using the `subtract` option of the\nspacing object, for example:\n\n```jsx\n<Box space={2} left={{ space: 2, options: { subtract: themeTokens.borderWidthLeft } }} />`\n```\n\nSee `useSpacingScale` hook for other spacing value options and documentation.\n\n## Theming\n\nBox is intended for layout, so minimal theming is supported. Use components like `Card` for\nmore sophisticated theming.\n\n## Scroll\n\nIf passed, the box will be scrollable. If an object is passed, it will be passed to React Native's\n`ScrollView` component as props.\n\nWhen building native iOS and Android apps, it is important to remember to ensure any screen containing\ntext content is inside a scrollable box, as screens are not scrollable by default and even very\nshort text will require scrolling on small devices at the highest accessibility text scaling settings.",
@@ -1915,70 +2186,12 @@
             "required": false,
             "description": "Use in tests if the box itself needs to be targetted and no other way of selecting the\nbox is available (e.g. it cannot be targetted using an appropriate `accessibilityRole`)."
           },
-          "children": {
-            "type": {
-              "name": "node"
-            },
-            "required": true,
-            "description": "Box accepts any content as children."
-          }
-        },
-        "attributes": {
-          "acceptsRNA11yProps": false
-        }
-      }
-    },
-    "Card": {
-      "docs": {
-        "description": "A basic card component, unstyled by default.\n\n## Component API\n\n### Background\n\nIn order to control the background of a card, the following tokens are currently\nsupported:\n\n- `backgroundColor`\n\n### Border\n\nThe following border tokens can be used:\n\n- `borderColor`\n- `borderRadius`\n- `borderWidth`\n\n### Padding\n\nPlease use the following tokens to control the padding:\n\n- `paddingBottom`\n- `paddingLeft`\n- `paddingRight`\n- `paddingTop`\n\nNote that various viewport sizes are supported as well.\n\n### Shadow\n\nFeel free to use the following properties within the `shadow` token:\n\n- `inset`: boolean\n- `color`: string\n- `offsetX`: number\n- `offsetY`: number\n- `blur`: number\n- `spread`: number\n\n## Accessibility\n\nCard supports all the common a11y props. Please remember that by marking a card as `accessible`\nyou automatically make inaccessible its children, which may or may not be appropriate\ndepending on what you are trying to achieve.",
-        "props": {
-          "children": {
-            "type": {
-              "name": "node"
-            },
-            "required": false,
-            "description": ""
-          },
-          "tokens": {
-            "type": {
-              "name": "custom",
-              "raw": {
-                "flex": "integer",
-                "backgroundColor": "color",
-                "borderColor": "color",
-                "borderRadius": "radius",
-                "borderWidth": "border",
-                "paddingBottom": "size",
-                "paddingLeft": "size",
-                "paddingRight": "size",
-                "paddingTop": "size",
-                "minWidth": "size",
-                "shadow": "shadow"
-              }
-            },
-            "required": false,
-            "description": ""
-          },
-          "variant": {
+          "children": {
             "type": {
-              "name": "objectOf",
-              "value": {
-                "name": "union",
-                "value": [
-                  {
-                    "name": "string"
-                  },
-                  {
-                    "name": "number"
-                  },
-                  {
-                    "name": "bool"
-                  }
-                ]
-              }
+              "name": "node"
             },
-            "required": false,
-            "description": ""
+            "required": true,
+            "description": "Box accepts any content as children."
           }
         },
         "attributes": {
@@ -1986,28 +2199,13 @@
         }
       }
     },
-    "PressableCardBase": {
+    "Card": {
       "docs": {
-        "description": "A pressable themeless base component that handles pressable states and passes tokens\nbased on these to an outer border and a base Card component. Not intended to be used in\napps or sites directly: build themed components on top of this.",
+        "description": "A basic card component, unstyled by default.\n\n## Component API\n\n### Background\n\nIn order to control the background of a card, the following tokens are currently\nsupported:\n\n- `backgroundColor`\n\n### Border\n\nThe following border tokens can be used:\n\n- `borderColor`\n- `borderRadius`\n- `borderWidth`\n\n### Padding\n\nPlease use the following tokens to control the padding:\n\n- `paddingBottom`\n- `paddingLeft`\n- `paddingRight`\n- `paddingTop`\n\nNote that various viewport sizes are supported as well.\n\n### Shadow\n\nFeel free to use the following properties within the `shadow` token:\n\n- `inset`: boolean\n- `color`: string\n- `offsetX`: number\n- `offsetY`: number\n- `blur`: number\n- `spread`: number\n\n## Accessibility\n\nCard supports all the common a11y props. Please remember that by marking a card as `accessible`\nyou automatically make inaccessible its children, which may or may not be appropriate\ndepending on what you are trying to achieve.",
         "props": {
-          "accessibilityRole": {
-            "defaultValue": {
-              "value": "href ? 'link' : undefined",
-              "computed": false
-            },
-            "required": false
-          },
           "children": {
             "type": {
-              "name": "union",
-              "value": [
-                {
-                  "name": "func"
-                },
-                {
-                  "name": "node"
-                }
-              ]
+              "name": "node"
             },
             "required": false,
             "description": ""
@@ -2015,7 +2213,19 @@
           "tokens": {
             "type": {
               "name": "custom",
-              "raw": "getTokensSetPropType(tokenKeys, { requireAll: true, allowFunction: true })"
+              "raw": {
+                "flex": "integer",
+                "backgroundColor": "color",
+                "borderColor": "color",
+                "borderRadius": "radius",
+                "borderWidth": "border",
+                "paddingBottom": "size",
+                "paddingLeft": "size",
+                "paddingRight": "size",
+                "paddingTop": "size",
+                "minWidth": "size",
+                "shadow": "shadow"
+              }
             },
             "required": false,
             "description": ""
@@ -2245,256 +2455,29 @@
                 "name": "union",
                 "value": [
                   {
-                    "name": "string"
-                  },
-                  {
-                    "name": "number"
-                  },
-                  {
-                    "name": "bool"
-                  }
-                ]
-              }
-            },
-            "required": false,
-            "description": ""
-          }
-        },
-        "attributes": {
-          "acceptsRNA11yProps": false
-        }
-      }
-    },
-    "ExpandCollapse": {
-      "docs": {
-        "description": "Flexible base component for lists where some or all items are collapsible headers.\n\nPass a render function as `children` which takes and passes `openIds` and `onToggle` props to\n<ExpandCollapse.Panel> children, and assign the panels explicit `panelId` props. The panels may be\nnested (they do not need to be direct children), and non-interactive items may be included too.",
-        "props": {
-          "variant": {
-            "type": {
-              "name": "objectOf",
-              "value": {
-                "name": "union",
-                "value": [
-                  {
-                    "name": "string"
-                  },
-                  {
-                    "name": "number"
-                  },
-                  {
-                    "name": "bool"
-                  }
-                ]
-              }
-            },
-            "required": false,
-            "description": ""
-          },
-          "tokens": {
-            "type": {
-              "name": "custom",
-              "raw": {
-                "borderColor": "color",
-                "borderWidth": "border",
-                "borderStyle": "borderStyle"
-              }
-            },
-            "required": false,
-            "description": ""
-          },
-          "children": {
-            "type": {
-              "name": "union",
-              "value": [
-                {
-                  "name": "func"
-                },
-                {
-                  "name": "node"
-                }
-              ]
-            },
-            "required": true,
-            "description": "ExpandCollapse usually takes a render function to which it passes an object with properties\n{ openIds, onToggle, resetValues, setValues, unsetValues }. openIds (array of ids) and\nonToggle (function) will usually be passed to `<ExpandCollapse.Panel>`"
-          },
-          "maxOpen": {
-            "type": {
-              "name": "number"
-            },
-            "required": false,
-            "description": "If set, enforces a specific maximum number of open items, closing already-open items when new\nitems are opened. By default, any number of items may be open at once."
-          },
-          "open": {
-            "type": {
-              "name": "arrayOf",
-              "value": {
-                "name": "string"
-              }
-            },
-            "required": false,
-            "description": "If passed, the item or items that are expanded will be controlled by a parent component"
-          },
-          "onChange": {
-            "type": {
-              "name": "func"
-            },
-            "required": false,
-            "description": "Function called when which panels are currently open changes. Necessary if `open` is passed."
-          },
-          "initialOpen": {
-            "type": {
-              "name": "arrayOf",
-              "value": {
-                "name": "string"
-              }
-            },
-            "required": false,
-            "description": "Allows items with specified ids to be open by default on first load. Should not be used with `open`."
-          }
-        },
-        "attributes": {
-          "acceptsRNA11yProps": false
-        }
-      },
-      "Panel": {
-        "docs": {
-          "description": "An item in an `ExpandCollapse` which contains collapsible `children` and a `control` that opens\nand closes the collapsible children when pressed.\n\nExpects `openIds` and `onToggle` props from the `ExpandCollapse` render function and a unique\n`panelId` that matches the ids passed to the `<ExpandCollapse>`.\n\nThe panel does not need to be a direct child of the `<ExpandCollapse>` (unless this is required\nby the chosen accessibility props for a particular accessibility tools).",
-          "props": {
-            "openIds": {
-              "defaultValue": {
-                "value": "[]",
-                "computed": false
-              },
-              "type": {
-                "name": "arrayOf",
-                "value": {
-                  "name": "union",
-                  "value": [
-                    {
-                      "name": "number"
-                    },
-                    {
-                      "name": "string"
-                    }
-                  ]
-                }
-              },
-              "required": false,
-              "description": "Array of the ids of currently open groups"
-            },
-            "variant": {
-              "type": {
-                "name": "objectOf",
-                "value": {
-                  "name": "union",
-                  "value": [
-                    {
-                      "name": "string"
-                    },
-                    {
-                      "name": "number"
-                    },
-                    {
-                      "name": "bool"
-                    }
-                  ]
-                }
-              },
-              "required": false,
-              "description": ""
-            },
-            "tokens": {
-              "type": {
-                "name": "custom",
-                "raw": {
-                  "expandDuration": "duration",
-                  "collapseDuration": "duration",
-                  "contentPaddingLeft": "size",
-                  "contentPaddingRight": "size",
-                  "contentPaddingTop": "size",
-                  "contentPaddingBottom": "size"
-                }
-              },
-              "required": false,
-              "description": ""
-            },
-            "panelId": {
-              "type": {
-                "name": "string"
-              },
-              "required": true,
-              "description": "Unique name by which the ExpandCollapse controls this element."
-            },
-            "onToggle": {
-              "type": {
-                "name": "func"
-              },
-              "required": true,
-              "description": "Function to call on pressing the panel's control, which should open or close the panel.\nIf Panel is a direct child of `ExpandCollapse`, this prop will be provided by the ExpandCollapse parent."
-            },
-            "onPress": {
-              "type": {
-                "name": "func"
-              },
-              "required": false,
-              "description": "Optional function to call on pressing the panel's control, in addition to opening or closing the panel."
-            },
-            "children": {
-              "type": {
-                "name": "union",
-                "value": [
-                  {
-                    "name": "func"
+                    "name": "string"
                   },
                   {
-                    "name": "node"
+                    "name": "number"
+                  },
+                  {
+                    "name": "bool"
                   }
                 ]
-              },
-              "required": false,
-              "description": "ExpandCollapsePanel's children are the content that is hidden or revealed on open or close, and may be any\nsingle React element or a render function which takes this group's isExpanded state, onToggle function and panelId"
-            },
-            "control": {
-              "type": {
-                "name": "custom",
-                "raw": "ExpandCollapseControl.propTypes.children.isRequired"
-              },
-              "required": false,
-              "description": "The content inside the always-visible control element that opens and closes the ExpandCollapse when pressed."
+              }
             },
-            "controlTokens": {
-              "type": {
-                "name": "custom",
-                "raw": {
-                  "icon": "icon",
-                  "iconColor": "color",
-                  "iconSize": "size",
-                  "iconGap": "size",
-                  "iconPosition": "position",
-                  "verticalAlign": "verticalAlign",
-                  "justifyContent": "flexJustifyContent",
-                  "paddingLeft": "size",
-                  "paddingRight": "size",
-                  "paddingTop": "size",
-                  "paddingBottom": "size",
-                  "borderWidth": "border",
-                  "borderColor": "color",
-                  "backgroundColor": "color"
-                }
-              },
-              "required": false,
-              "description": "Optional theme token overrides that may be passed to the ExpandCollapseControl element."
-            }
-          },
-          "attributes": {
-            "acceptsRNA11yProps": false
+            "required": false,
+            "description": ""
           }
+        },
+        "attributes": {
+          "acceptsRNA11yProps": false
         }
       }
     },
-    "Accordion": {
+    "ExpandCollapse": {
       "docs": {
-        "description": "'Accordion' is a shorthand for an ExpandCollapse where only one item may be open at a time",
+        "description": "Flexible base component for lists where some or all items are collapsible headers.\n\nPass a render function as `children` which takes and passes `openIds` and `onToggle` props to\n<ExpandCollapse.Panel> children, and assign the panels explicit `panelId` props. The panels may be\nnested (they do not need to be direct children), and non-interactive items may be included too.",
         "props": {
           "variant": {
             "type": {
@@ -2824,6 +2807,27 @@
       "docs": {
         "description": "An alternative to InputSupports for groups of input elements that, on web, are to be\nwrapped in a `<fieldset>` tag, with label content displated in a `<legend>` tag.\n\nFollows the same theming and most of the same props as InputSupports.",
         "props": {
+          "copy": {
+            "defaultValue": {
+              "value": "'en'",
+              "computed": false
+            },
+            "type": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'en'",
+                  "computed": false
+                },
+                {
+                  "value": "'fr'",
+                  "computed": false
+                }
+              ]
+            },
+            "required": false,
+            "description": "Whether the English or French copy will be used (e.g. for accessibility labels)."
+          },
           "feedbackPosition": {
             "defaultValue": {
               "value": "'top'",
@@ -4182,6 +4186,27 @@
       "docs": {
         "description": "",
         "props": {
+          "copy": {
+            "defaultValue": {
+              "value": "'en'",
+              "computed": false
+            },
+            "type": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'en'",
+                  "computed": false
+                },
+                {
+                  "value": "'fr'",
+                  "computed": false
+                }
+              ]
+            },
+            "required": false,
+            "description": "Whether the English or French copy will be used (e.g. for accessibility labels)."
+          },
           "hintPosition": {
             "defaultValue": {
               "value": "'inline'",
@@ -4442,91 +4467,6 @@
         }
       }
     },
-    "ListItem": {
-      "docs": {
-        "description": "ListItem is responsible for rendering icon or a bullet as side item",
-        "props": {
-          "tokens": {
-            "type": {
-              "name": "custom",
-              "raw": {
-                "iconMarginTop": "size",
-                "itemFontWeight": "fontWeight",
-                "itemFontSize": "fontSize",
-                "itemLineHeight": "lineHeight",
-                "itemFontName": "fontName",
-                "interItemMargin": "size",
-                "interItemMarginWithDivider": "size",
-                "dividerColor": "color",
-                "dividerSize": "border",
-                "itemBulletContainerWidth": "size",
-                "itemBulletContainerAlign": "textAlign",
-                "itemBulletWidth": "size",
-                "itemBulletHeight": "size",
-                "itemBulletColor": "color",
-                "itemIconSize": "size",
-                "itemIconColor": "color",
-                "listGutter": "size"
-              }
-            },
-            "required": false,
-            "description": ""
-          },
-          "variant": {
-            "type": {
-              "name": "objectOf",
-              "value": {
-                "name": "union",
-                "value": [
-                  {
-                    "name": "string"
-                  },
-                  {
-                    "name": "number"
-                  },
-                  {
-                    "name": "bool"
-                  }
-                ]
-              }
-            },
-            "required": false,
-            "description": ""
-          },
-          "children": {
-            "type": {
-              "name": "node"
-            },
-            "required": true,
-            "description": ""
-          },
-          "icon": {
-            "type": {
-              "name": "func"
-            },
-            "required": false,
-            "description": "Renders side item icon"
-          },
-          "iconColor": {
-            "type": {
-              "name": "string"
-            },
-            "required": false,
-            "description": "Will set display icon color"
-          },
-          "iconSize": {
-            "type": {
-              "name": "number"
-            },
-            "required": false,
-            "description": "Allow the user define the icon size if not defined the theme's file"
-          }
-        },
-        "attributes": {
-          "acceptsRNA11yProps": false
-        }
-      }
-    },
     "ListBase": {
       "docs": {
         "description": "An unordered List component has a child a ListItem that\nallows icon, dividers and customized typography",
@@ -4649,38 +4589,123 @@
               "required": false,
               "description": ""
             },
-            "children": {
-              "type": {
-                "name": "node"
-              },
-              "required": true,
-              "description": ""
+            "children": {
+              "type": {
+                "name": "node"
+              },
+              "required": true,
+              "description": ""
+            },
+            "icon": {
+              "type": {
+                "name": "func"
+              },
+              "required": false,
+              "description": "Renders side item icon"
+            },
+            "iconColor": {
+              "type": {
+                "name": "string"
+              },
+              "required": false,
+              "description": "Will set display icon color"
+            },
+            "iconSize": {
+              "type": {
+                "name": "number"
+              },
+              "required": false,
+              "description": "Allow the user define the icon size if not defined the theme's file"
+            }
+          },
+          "attributes": {
+            "acceptsRNA11yProps": false
+          }
+        }
+      }
+    },
+    "ListItem": {
+      "docs": {
+        "description": "ListItem is responsible for rendering icon or a bullet as side item",
+        "props": {
+          "tokens": {
+            "type": {
+              "name": "custom",
+              "raw": {
+                "iconMarginTop": "size",
+                "itemFontWeight": "fontWeight",
+                "itemFontSize": "fontSize",
+                "itemLineHeight": "lineHeight",
+                "itemFontName": "fontName",
+                "interItemMargin": "size",
+                "interItemMarginWithDivider": "size",
+                "dividerColor": "color",
+                "dividerSize": "border",
+                "itemBulletContainerWidth": "size",
+                "itemBulletContainerAlign": "textAlign",
+                "itemBulletWidth": "size",
+                "itemBulletHeight": "size",
+                "itemBulletColor": "color",
+                "itemIconSize": "size",
+                "itemIconColor": "color",
+                "listGutter": "size"
+              }
+            },
+            "required": false,
+            "description": ""
+          },
+          "variant": {
+            "type": {
+              "name": "objectOf",
+              "value": {
+                "name": "union",
+                "value": [
+                  {
+                    "name": "string"
+                  },
+                  {
+                    "name": "number"
+                  },
+                  {
+                    "name": "bool"
+                  }
+                ]
+              }
+            },
+            "required": false,
+            "description": ""
+          },
+          "children": {
+            "type": {
+              "name": "node"
             },
-            "icon": {
-              "type": {
-                "name": "func"
-              },
-              "required": false,
-              "description": "Renders side item icon"
+            "required": true,
+            "description": ""
+          },
+          "icon": {
+            "type": {
+              "name": "func"
             },
-            "iconColor": {
-              "type": {
-                "name": "string"
-              },
-              "required": false,
-              "description": "Will set display icon color"
+            "required": false,
+            "description": "Renders side item icon"
+          },
+          "iconColor": {
+            "type": {
+              "name": "string"
             },
-            "iconSize": {
-              "type": {
-                "name": "number"
-              },
-              "required": false,
-              "description": "Allow the user define the icon size if not defined the theme's file"
-            }
+            "required": false,
+            "description": "Will set display icon color"
           },
-          "attributes": {
-            "acceptsRNA11yProps": false
+          "iconSize": {
+            "type": {
+              "name": "number"
+            },
+            "required": false,
+            "description": "Allow the user define the icon size if not defined the theme's file"
           }
+        },
+        "attributes": {
+          "acceptsRNA11yProps": false
         }
       }
     },
@@ -4843,7 +4868,7 @@
               ]
             },
             "required": false,
-            "description": "Select english or french copy for the accessible label of the dismiss button."
+            "description": "Select English or French copy for the accessible label of the dismiss button."
           },
           "children": {
             "type": {
@@ -5241,6 +5266,67 @@
         }
       }
     },
+    "PressableCardBase": {
+      "docs": {
+        "description": "A pressable themeless base component that handles pressable states and passes tokens\nbased on these to an outer border and a base Card component. Not intended to be used in\napps or sites directly: build themed components on top of this.",
+        "props": {
+          "accessibilityRole": {
+            "defaultValue": {
+              "value": "href ? 'link' : undefined",
+              "computed": false
+            },
+            "required": false
+          },
+          "children": {
+            "type": {
+              "name": "union",
+              "value": [
+                {
+                  "name": "func"
+                },
+                {
+                  "name": "node"
+                }
+              ]
+            },
+            "required": false,
+            "description": ""
+          },
+          "tokens": {
+            "type": {
+              "name": "custom",
+              "raw": "getTokensSetPropType(tokenKeys, { requireAll: true, allowFunction: true })"
+            },
+            "required": false,
+            "description": ""
+          },
+          "variant": {
+            "type": {
+              "name": "objectOf",
+              "value": {
+                "name": "union",
+                "value": [
+                  {
+                    "name": "string"
+                  },
+                  {
+                    "name": "number"
+                  },
+                  {
+                    "name": "bool"
+                  }
+                ]
+              }
+            },
+            "required": false,
+            "description": ""
+          }
+        },
+        "attributes": {
+          "acceptsRNA11yProps": false
+        }
+      }
+    },
     "Progress": {
       "docs": {
         "description": "The `Progress` is a container for displaying one or several `ProgressBar`s.\n\n## Props\n\n- Use `children` prop to pass one or multiple `ProgressBar`s. Note that in case of stacked progress bars\n  each next will be displayed on top of the previous one.\n\n## Tokens\n\n- Use the following tokens to customize the appearance:\n  - `backgroundColor` for the background color of the progress container,\n  - `borderColor` to control the color of the border,\n  - `borderRadius` for the rounded corners,\n  - `borderWidth` to change the border width.\n  - `height` to control the height of the progress bars displayed within the progress bar container.\n\n## Variants\n\n- Use the `size` variant to control the height of your progress bars:  passing `'mini'` will make your\n  progress bar container narrower.\n\n## Usability and A11y guidelines\n\n`Progress` component accepts the standard accessibility properties, however it's more important to make sure\nits children (instances of `ProgressBar`) receive the accessibility properties specific to the `progressbar`\nrole.",
@@ -5742,7 +5828,7 @@
               ]
             },
             "required": false,
-            "description": "Select english or french copy for the accessible labels.\nYou may also pass in a custom dictionary object."
+            "description": "Select English or French copy for the accessible labels.\nYou may also pass in a custom dictionary object."
           },
           "initialValue": {
             "type": {
@@ -5786,6 +5872,13 @@
             "required": false,
             "description": "Triggered when the clear button is pressed."
           },
+          "onFocus": {
+            "type": {
+              "name": "func"
+            },
+            "required": false,
+            "description": "Triggered when the search input is focused."
+          },
           "accessibilityLabel": {
             "type": {
               "name": "string"
@@ -6357,6 +6450,27 @@
       "docs": {
         "description": "",
         "props": {
+          "sizeIndex": {
+            "defaultValue": {
+              "value": "size",
+              "computed": true
+            },
+            "type": {
+              "name": "union",
+              "value": [
+                {
+                  "name": "custom",
+                  "raw": "spacingIndexPropType"
+                },
+                {
+                  "name": "custom",
+                  "raw": "spacingObjectPropType"
+                }
+              ]
+            },
+            "required": false,
+            "description": "Sets the size of Skeleton lines or shape according to the theme's spacing scale. For example, size={1} gives the smallest non-zero theme-defined spacing size.\n\nMay also accept an object with responsive viewport keys or spacing scale options - see `useSpacingScale` for details."
+          },
           "shape": {
             "defaultValue": {
               "value": "'line'",
@@ -6380,7 +6494,7 @@
               ]
             },
             "required": false,
-            "description": ""
+            "description": "Determines if the skeleton should resemble lines of text (default), a circle, or a square box with themed rounded corners."
           },
           "tokens": {
             "type": {
@@ -6421,24 +6535,42 @@
           },
           "size": {
             "type": {
-              "name": "number"
+              "name": "union",
+              "value": [
+                {
+                  "name": "custom",
+                  "raw": "spacingIndexPropType"
+                },
+                {
+                  "name": "custom",
+                  "raw": "spacingObjectPropType"
+                }
+              ]
             },
             "required": false,
-            "description": ""
+            "description": "@deprecated alias for `sizeIndex`"
+          },
+          "sizePixels": {
+            "type": {
+              "name": "custom",
+              "raw": "responsiveProps.getTypeOptionallyByViewport(propTypes.number)"
+            },
+            "required": false,
+            "description": "Sets the size of Skeleton lines or shape to an exact number of pixels. Use when it's necessary to exactly match sizes of images or other boxes.\n\nAccepts a number or an object with responsive viewport keys, e.g. { xs: 32, lg: 64 } would be 32px at xs, sm and md and 64 at lg and xl viewports."
           },
           "characters": {
             "type": {
               "name": "number"
             },
             "required": false,
-            "description": ""
+            "description": "Determines the width of simulated lines of text if the Skeleton's shape is 'line' (the default shape).\n\nOnly has any affect if shape is line (the default). If unset, takes a default value from the theme."
           },
           "lines": {
             "type": {
               "name": "number"
             },
             "required": false,
-            "description": ""
+            "description": "Determines how many Skeleton items are rendered (default 1).\n\nRecommended usage is to simulate paragraphs of text when Skeleton's shape is 'line' (the default shape).\n\nThe amount of spacing between multiple lines is controlled by theme tokens."
           }
         },
         "attributes": {
@@ -7167,6 +7299,42 @@
         }
       }
     },
+    "ThemeProvider": {
+      "docs": {
+        "description": "",
+        "props": {
+          "children": {
+            "type": {
+              "name": "node"
+            },
+            "required": true,
+            "description": ""
+          },
+          "defaultTheme": {
+            "type": {
+              "name": "shape",
+              "value": {
+                "metadata": {
+                  "name": "shape",
+                  "value": {
+                    "themeTokensVersion": {
+                      "name": "string",
+                      "required": true
+                    }
+                  },
+                  "required": true
+                }
+              }
+            },
+            "required": true,
+            "description": ""
+          }
+        },
+        "attributes": {
+          "acceptsRNA11yProps": false
+        }
+      }
+    },
     "Tooltip": {
       "docs": {
         "description": "Tooltip provides a descriptive and detailed explanation or instructions. It can be used next to an input label\nto help a user fill it in, or as a standalone component.\n\nBy default the TooltipButton component will be used as a control for triggering the tooltip, but you may attach\na tooltip to any other component. A render function can be used to adjust the control's styling on state changes (hover, focus, etc.).\n\n### Positioning\nBy default a Tooltip will be automatically positioned in a way that ensures it fits within the viewport.\nYou may suggest a position with a prop - it will be used, unless the tooltip would end up outside the viewport.\n\n### Usage criteria\n- You may use one when the information is useful only to a small percentage of users (ie. tech savvy people wouldn't need this info).\n- Tooltips may also be useful when vertical space is an issue.",
@@ -7223,7 +7391,7 @@
               ]
             },
             "required": false,
-            "description": "Select english or french copy for the accessible label."
+            "description": "Select English or French copy for the accessible label."
           },
           "children": {
             "type": {
@@ -7560,69 +7728,27 @@
                 },
                 {
                   "value": "'h5'",
-                  "computed": false
-                },
-                {
-                  "value": "'h6'",
-                  "computed": false
-                },
-                {
-                  "value": "true",
-                  "computed": false
-                }
-              ]
-            },
-            "required": false,
-            "description": "Renders the text as a semantic heading. If a html heading tag is provided, uses that tag on Web.\n\nDoes not affect styling: <Typography heading=\"h2\"> will render a <h2> that looks like plain text.\nUse both `heading` and `variant` props to render semantic headings that look like headings.\n\nIn native apps, if this is `true` or any html heading tag string and accessibilityRole prop\nis not defined, the accessibilityRole will default to \"heading\"."
-          },
-          "children": {
-            "type": {
-              "name": "node"
-            },
-            "required": false,
-            "description": "Same children allowed as a React Native <Text> node"
-          }
-        },
-        "attributes": {
-          "acceptsRNA11yProps": false
-        }
-      }
-    },
-    "A11yInfoProvider": {
-      "docs": {
-        "description": "",
-        "props": {
-          "children": {
-            "type": {
-              "name": "node"
-            },
-            "required": true,
-            "description": ""
-          }
-        },
-        "attributes": {
-          "acceptsRNA11yProps": false
-        }
-      }
-    },
-    "BaseProvider": {
-      "docs": {
-        "description": "",
-        "props": {
-          "defaultTheme": {
-            "type": {
-              "name": "custom",
-              "raw": "ThemeProvider.propTypes?.defaultTheme"
+                  "computed": false
+                },
+                {
+                  "value": "'h6'",
+                  "computed": false
+                },
+                {
+                  "value": "true",
+                  "computed": false
+                }
+              ]
             },
             "required": false,
-            "description": ""
+            "description": "Renders the text as a semantic heading. If a html heading tag is provided, uses that tag on Web.\n\nDoes not affect styling: <Typography heading=\"h2\"> will render a <h2> that looks like plain text.\nUse both `heading` and `variant` props to render semantic headings that look like headings.\n\nIn native apps, if this is `true` or any html heading tag string and accessibilityRole prop\nis not defined, the accessibilityRole will default to \"heading\"."
           },
           "children": {
             "type": {
               "name": "node"
             },
-            "required": true,
-            "description": ""
+            "required": false,
+            "description": "Same children allowed as a React Native <Text> node"
           }
         },
         "attributes": {
@@ -7647,42 +7773,6 @@
         }
       }
     },
-    "ThemeProvider": {
-      "docs": {
-        "description": "",
-        "props": {
-          "children": {
-            "type": {
-              "name": "node"
-            },
-            "required": true,
-            "description": ""
-          },
-          "defaultTheme": {
-            "type": {
-              "name": "shape",
-              "value": {
-                "metadata": {
-                  "name": "shape",
-                  "value": {
-                    "themeTokensVersion": {
-                      "name": "string",
-                      "required": true
-                    }
-                  },
-                  "required": true
-                }
-              }
-            },
-            "required": true,
-            "description": ""
-          }
-        },
-        "attributes": {
-          "acceptsRNA11yProps": false
-        }
-      }
-    },
     "Button": {
       "docs": {
         "description": "",
@@ -7767,11 +7857,231 @@
               }
             },
             "required": false,
-            "description": ""
+            "description": ""
+          }
+        },
+        "attributes": {
+          "acceptsRNA11yProps": true
+        }
+      }
+    },
+    "ButtonGroup": {
+      "docs": {
+        "description": "",
+        "props": {
+          "items": {
+            "defaultValue": {
+              "value": "[]",
+              "computed": false
+            },
+            "type": {
+              "name": "arrayOf",
+              "value": {
+                "name": "shape",
+                "value": {
+                  "label": {
+                    "name": "string",
+                    "description": "The text displayed to the user in the button, describing this option,\npassed to the button as its child.",
+                    "required": true
+                  },
+                  "accessibilityLabel": {
+                    "name": "string",
+                    "description": "An optional accessibility label may be passed to ButtonGroup Buttons\nwhich is applied as normal for a React Native accessibilityLabel prop.",
+                    "required": false
+                  },
+                  "id": {
+                    "name": "string",
+                    "description": "An optional unique string may be provided to identify this option,\nwhich will be used in code and passed to any onChange function.\nIf not provided, the label is used.",
+                    "required": false
+                  },
+                  "ref": {
+                    "name": "custom",
+                    "raw": "ABBPropTypes.ref()",
+                    "description": "An optional ref for one individual button in the ButtonGroup",
+                    "required": false
+                  }
+                }
+              }
+            },
+            "required": false,
+            "description": "The options a user may select"
+          },
+          "maxValues": {
+            "defaultValue": {
+              "value": "1",
+              "computed": false
+            },
+            "type": {
+              "name": "number"
+            },
+            "required": false,
+            "description": "The maximum number of items a user may select at once. Defaults to 1 and behaves\nlike radio buttons. To have no limit and allow any number of selections, pass `null`."
+          },
+          "readOnly": {
+            "defaultValue": {
+              "value": "false",
+              "computed": false
+            },
+            "type": {
+              "name": "bool"
+            },
+            "required": false,
+            "description": "If true, the buttons cannot be selected by the user and simply show their current state."
+          },
+          "inactive": {
+            "defaultValue": {
+              "value": "false",
+              "computed": false
+            },
+            "type": {
+              "name": "bool"
+            },
+            "required": false,
+            "description": "If true, the buttons cannot be interacted with, elements are set as `disabled` and if the\ntheme supports `inactive` appearances rules, these are applied."
+          },
+          "accessibilityRole": {
+            "defaultValue": {
+              "value": "maxValues === 1\n? 'radiogroup' // radiogroup is cross-platform; only web aria has generic groups\n: Platform.select({ web: 'group', default: 'none' })",
+              "computed": false
+            },
+            "required": false
+          },
+          "tokens": {
+            "type": {
+              "name": "custom",
+              "raw": {
+                "space": "integer",
+                "fieldSpace": "integer",
+                "direction": "direction",
+                "alignItems": "flexAlign",
+                "justifyContent": "flexJustifyContent",
+                "flexGrow": "integer",
+                "flexShrink": "integer"
+              }
+            },
+            "required": false,
+            "description": ""
+          },
+          "variant": {
+            "type": {
+              "name": "objectOf",
+              "value": {
+                "name": "union",
+                "value": [
+                  {
+                    "name": "string"
+                  },
+                  {
+                    "name": "number"
+                  },
+                  {
+                    "name": "bool"
+                  }
+                ]
+              }
+            },
+            "required": false,
+            "description": ""
+          },
+          "onChange": {
+            "type": {
+              "name": "func"
+            },
+            "required": false,
+            "description": "If provided, this function is called when the current selection is changed\nand is passed an array of the `id`s of all currently selected `items`."
+          },
+          "values": {
+            "type": {
+              "name": "arrayOf",
+              "value": {
+                "name": "string"
+              }
+            },
+            "required": false,
+            "description": "If the selected item(s) in the button group are to be controlled externally by\na parent component, pass an array of strings as well as an `onChange` handler.\nPassing an array for \"values\" makes the ButtonGroup a \"controlled\" component that\nexpects its state to be handled via `onChange` and so doesn't handle it itself."
+          },
+          "initialValues": {
+            "type": {
+              "name": "arrayOf",
+              "value": {
+                "name": "string"
+              }
+            },
+            "required": false,
+            "description": "If `values` is not passed, making the ButtonGroup an \"uncontrolled\" component\nmanaging its own selected state, a default set of selections may be provided.\nChanging the `initialValues` does not change the user's selections."
+          },
+          "legend": {
+            "type": {
+              "name": "string"
+            },
+            "required": false,
+            "description": "Main text used to describe this group, used in Fieldset's Legend element."
+          },
+          "hint": {
+            "type": {
+              "name": "string"
+            },
+            "required": false,
+            "description": "Optional additional text giving more detail to help a user make a choice."
+          },
+          "tooltip": {
+            "type": {
+              "name": "string"
+            },
+            "required": false,
+            "description": "Optional tooltip text content to include alongside the legend and hint."
+          },
+          "validation": {
+            "type": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'error'",
+                  "computed": false
+                },
+                {
+                  "value": "'success'",
+                  "computed": false
+                }
+              ]
+            },
+            "required": false,
+            "description": "Current validation status of the group, passed to the feedback element if there is one."
+          },
+          "feedback": {
+            "type": {
+              "name": "string"
+            },
+            "required": false,
+            "description": "If provided, a Feedback element is rendered containing this text."
+          },
+          "name": {
+            "type": {
+              "name": "string"
+            },
+            "required": false,
+            "description": "On Web, this is passed to the `name` attribute of the fieldset."
+          },
+          "copy": {
+            "type": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'en'",
+                  "computed": false
+                },
+                {
+                  "value": "'fr'",
+                  "computed": false
+                }
+              ]
+            },
+            "required": false,
+            "description": "Sets the language of microcopy in subcomponents (e.g. Tooltip's default accessibility label)."
           }
         },
         "attributes": {
-          "acceptsRNA11yProps": true
+          "acceptsRNA11yProps": false
         }
       }
     },
@@ -7927,148 +8237,6 @@
         }
       }
     },
-    "ButtonGroup": {
-      "docs": {
-        "description": "",
-        "props": {
-          "items": {
-            "defaultValue": {
-              "value": "[]",
-              "computed": false
-            },
-            "type": {
-              "name": "arrayOf",
-              "value": {
-                "name": "shape",
-                "value": {
-                  "label": {
-                    "name": "string",
-                    "description": "The text displayed to the user in the button, describing this option,\npassed to the button as its child.",
-                    "required": true
-                  },
-                  "accessibilityLabel": {
-                    "name": "string",
-                    "description": "An optional accessibility label may be passed to ButtonGroup Buttons\nwhich is applied as normal for a React Native accessibilityLabel prop.",
-                    "required": false
-                  },
-                  "id": {
-                    "name": "string",
-                    "description": "An optional unique string may be provided to identify this option,\nwhich will be used in code and passed to any onChange function.\nIf not provided, the label is used.",
-                    "required": false
-                  },
-                  "ref": {
-                    "name": "custom",
-                    "raw": "ABBPropTypes.ref()",
-                    "description": "An optional ref for one individual button in the ButtonGroup",
-                    "required": false
-                  }
-                }
-              }
-            },
-            "required": false,
-            "description": "The options a user may select"
-          },
-          "maxValues": {
-            "defaultValue": {
-              "value": "1",
-              "computed": false
-            },
-            "type": {
-              "name": "number"
-            },
-            "required": false,
-            "description": "The maximum number of items a user may select at once. Defaults to 1 and behaves\nlike radio buttons. To have no limit and allow any number of selections, pass `null`."
-          },
-          "readOnly": {
-            "defaultValue": {
-              "value": "false",
-              "computed": false
-            },
-            "required": false
-          },
-          "inactive": {
-            "defaultValue": {
-              "value": "false",
-              "computed": false
-            },
-            "required": false
-          },
-          "accessibilityRole": {
-            "defaultValue": {
-              "value": "maxValues === 1\n? 'radiogroup' // radiogroup is cross-platform; only web aria has generic groups\n: Platform.select({ web: 'group', default: 'none' })",
-              "computed": false
-            },
-            "required": false
-          },
-          "tokens": {
-            "type": {
-              "name": "custom",
-              "raw": {
-                "space": "integer",
-                "direction": "direction",
-                "alignItems": "flexAlign",
-                "justifyContent": "flexJustifyContent",
-                "flexGrow": "integer",
-                "flexShrink": "integer"
-              }
-            },
-            "required": false,
-            "description": ""
-          },
-          "variant": {
-            "type": {
-              "name": "objectOf",
-              "value": {
-                "name": "union",
-                "value": [
-                  {
-                    "name": "string"
-                  },
-                  {
-                    "name": "number"
-                  },
-                  {
-                    "name": "bool"
-                  }
-                ]
-              }
-            },
-            "required": false,
-            "description": ""
-          },
-          "onChange": {
-            "type": {
-              "name": "func"
-            },
-            "required": false,
-            "description": "If provided, this function is called when the current selection is changed\nand is passed an array of the `id`s of all currently selected `items`."
-          },
-          "values": {
-            "type": {
-              "name": "arrayOf",
-              "value": {
-                "name": "string"
-              }
-            },
-            "required": false,
-            "description": "If the selected item(s) in the button group are to be controlled externally by\na parent component, pass an array of strings as well as an `onChange` handler.\nPassing an array for \"values\" makes the ButtonGroup a \"controlled\" component that\nexpects its state to be handled via `onChange` and so doesn't handle it itself."
-          },
-          "initialValues": {
-            "type": {
-              "name": "arrayOf",
-              "value": {
-                "name": "string"
-              }
-            },
-            "required": false,
-            "description": "If `values` is not passed, making the ButtonGroup an \"uncontrolled\" component\nmanaging its own selected state, a default set of selections may be provided.\nChanging the `initialValues` does not change the user's selections."
-          }
-        },
-        "attributes": {
-          "acceptsRNA11yProps": false
-        }
-      }
-    },
     "CheckboxGroup": {
       "docs": {
         "description": "A group of Checkboxs that behave as a fieldset. Use when users select any number of choices from options.\n\n## Component API\n\nUse the `items` prop to pass an array of objects describing each Checkbox in the group:\n\n - `label`: main text passed to CheckboxGroup's `label` prop\n - `id`: identifier used to store which CheckboxGroup is selected (uses `label` if undefinded)\n - `onChange`: optional function called on selection, in addition to updating the group's selection state\n\n### Controlled version\n\nIf the selection state is controlled from outside, it needs to receive `checkedId` and `onChange` props.\n\n### Uncontrolled version\n\nIf the CheckboxGroup manages its own state, you can use `initialCheckedId` prop to provide the initial value.\nWhenever the radio card gets toggled, it calls the `onChange` callback with the new value (string).\n\n### Use in forms\n\nFor web forms, the `name` prop may be used to define the name of the group's `fieldset` and input elements.\n\n### Validation\n\nValidation state may be set by passing 'error' or 'success' to the `validation` prop.\n\n## A11y guidelines\n\nCheckboxGroup accepts all the common accessibility props, and controls the accessibility state\nof children like Checkbox and Feedback based on current state.\n\n@example\n```jsx\n<CheckboxGroup\n  initialCheckedId=\"check1\"\n  items={[\n    { label: 'Checkbox 1', id: 'check1' },\n    { label: 'Checkbox 2', id: 'check2' },\n    { label: 'Checkbox 3', id: 'check3' }\n  ]}\n  legend=\"Checkboxes\"\n  hint=\"Choose from these options\"\n/>\n```",
@@ -8247,21 +8415,21 @@
               "name": "bool"
             },
             "required": false,
-            "description": "If true, the radio cards cannot be selected by the user and simply show their current state."
+            "description": "If true, the checkboxes cannot be selected by the user and simply show their current state."
           },
           "inactive": {
             "type": {
               "name": "bool"
             },
             "required": false,
-            "description": "If true, the checkbox cannot be interacted with, elements are set as `disabled` and if the\ntheme supports `inactive` appearances rules, these are applied."
+            "description": "If true, the checkboxes cannot be interacted with, elements are set as `disabled` and if the\ntheme supports `inactive` appearances rules, these are applied."
           },
           "name": {
             "type": {
               "name": "string"
             },
             "required": false,
-            "description": "On Web, this is passed to the `name` attribute of the fieldset and each radio input."
+            "description": "On Web, this is passed to the `name` attribute of the fieldset and each checkbox input."
           }
         },
         "attributes": {
@@ -8749,8 +8917,29 @@
     },
     "RadioGroup": {
       "docs": {
-        "description": "A group of Radios that behave as a radio group. Use when users select a single choice from mutually\nexclusive options.\n\n## Component API\n\nUse the `items` prop to pass an array of objects describing each Radio in the group:\n\n - `label`: main text passed to Radio's `label` prop\n - `id`: identifier used to store which Radio is selected (uses `label` if undefinded)\n - `onChange`: optional function called on selection, in addition to updating the group's selection state\n\n### Controlled version\n\nIf the selection state is controlled from outside, it needs to receive `checkedId` and `onChange` props.\n\n### Uncontrolled version\n\nIf the RadioGroup manages its own state, you can use `initialCheckedId` prop to provide the initial value.\nWhenever the radio card gets toggled, it calls the `onChange` callback with the new value (string).\n\n### Use in forms\n\nFor web forms, the `name` prop may be used to define the name of the group's `fieldset` and input elements.\n\n### Validation\n\nValidation state may be set by passing 'error' or 'success' to the `validation` prop.\n\n## A11y guidelines\n\nRadioGroup accepts all the common accessibility props, but also sets accessibility role `'radiogroup'`\nand controls the accessibility state of children like Radio and Feedback based on current state.\n\n@example\n```jsx\n<RadioGroup\n  initialCheckedId=\"radio1\"\n  items={[\n    { label: 'Radio 1', id: 'radio1' },\n    { label: 'Radio 2', id: 'radio2' },\n    { label: 'Radio 3', id: 'radio3' }\n  ]}\n  legend=\"Radios\"\n  hint=\"Choose one option\"\n/>\n```",
+        "description": "A group of Radios that behave as a radio group. Use when users select a single choice from mutually\nexclusive options.\n\n## Component API\n\nUse the `items` prop to pass an array of objects describing each Radio in the group:\n\n - `label`: main text passed to Radio's `label` prop\n - `id`: identifier used to store which Radio is selected (uses `label` if undefinded)\n - `onChange`: optional function called on selection, in addition to updating the group's selection state\n\n### Controlled version\n\nIf the selection state is controlled from outside, it needs to receive `checkedId` and `onChange` props.\n\n### Uncontrolled version\n\nIf the RadioGroup manages its own state, you can use `initialCheckedId` prop to provide the initial value.\nWhenever the radio gets toggled, it calls the `onChange` callback with the new value (string).\n\n### Use in forms\n\nFor web forms, the `name` prop may be used to define the name of the group's `fieldset` and input elements.\n\n### Validation\n\nValidation state may be set by passing 'error' or 'success' to the `validation` prop.\n\n## A11y guidelines\n\nRadioGroup accepts all the common accessibility props, but also sets accessibility role `'radiogroup'`\nand controls the accessibility state of children like Radio and Feedback based on current state.\n\n@example\n```jsx\n<RadioGroup\n  initialCheckedId=\"radio1\"\n  items={[\n    { label: 'Radio 1', id: 'radio1' },\n    { label: 'Radio 2', id: 'radio2' },\n    { label: 'Radio 3', id: 'radio3' }\n  ]}\n  legend=\"Radios\"\n  hint=\"Choose one option\"\n/>\n```",
         "props": {
+          "copy": {
+            "defaultValue": {
+              "value": "'en'",
+              "computed": false
+            },
+            "type": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'en'",
+                  "computed": false
+                },
+                {
+                  "value": "'fr'",
+                  "computed": false
+                }
+              ]
+            },
+            "required": false,
+            "description": "Whether the English or French copy will be used (e.g. for accessibility labels)."
+          },
           "items": {
             "defaultValue": {
               "value": "[]",
@@ -8903,14 +9092,14 @@
               "name": "string"
             },
             "required": false,
-            "description": "If provided, the radio card with this id is selected on first render."
+            "description": "If provided, the radio with this id is selected on first render."
           },
           "checkedId": {
             "type": {
               "name": "string"
             },
             "required": false,
-            "description": "If not undefined, the radio card with this id is selected (or none is selected if `null`), and the\nelement's selection state will be controlled by its parent using the `onChange` function."
+            "description": "If not undefined, the radio with this id is selected (or none is selected if `null`), and the\nelement's selection state will be controlled by its parent using the `onChange` function."
           },
           "onChange": {
             "type": {
@@ -8924,14 +9113,14 @@
               "name": "bool"
             },
             "required": false,
-            "description": "If true, the radio cards cannot be selected by the user and simply show their current state."
+            "description": "If true, the radios cannot be selected by the user and simply show their current state."
           },
           "inactive": {
             "type": {
               "name": "bool"
             },
             "required": false,
-            "description": "If true, the radio card cannot be interacted with, elements are set as `disabled` and if the\ntheme supports `inactive` appearances rules, these are applied."
+            "description": "If true, the radios cannot be interacted with, elements are set as `disabled` and if the\ntheme supports `inactive` appearances rules, these are applied."
           },
           "name": {
             "type": {
@@ -8950,6 +9139,27 @@
       "docs": {
         "description": "A group of Cards that behave as a radio button group. Use when users select a single choice from mutually\nexclusive options with need to show additional information for each option. The whole cards are each\ninteractive as one item.\n\n## Component API\n\nUse the `items` prop to pass an array of objects describing each RadioCard in the group:\n\n - `title`: main text passed to RadioCard's `title` prop\n - `content`: React content passed to RadioCard's `children` prop\n - `id`: identifier used to store which RadioCard is selected (uses `title` if undefinded)\n - `onChange`: optional function called on selection, in addition to updating the group's selection state\n\n### Controlled version\n\nIf the selection state is controlled from outside, it needs to receive `checkedId` and `onChange` props.\n\n### Uncontrolled version\n\nIf the RadioCardGroup manages its own state, you can use `initialCheckedId` prop to provide the initial value.\nWhenever the radio card gets toggled, it calls the `onChange` callback with the new value (string).\n\n### Use in forms\n\nFor web forms, the `name` prop may be used to define the name of the group's `fieldset` and input elements.\n\n### Validation\n\nValidation state may be set by passing 'error' or 'success' to the `validation` prop.\n\n## A11y guidelines\n\nRadioCardGroup accepts all the common accessibility props, but also sets accessibility role `'radiogroup'`\nand controls the accessibility state of children like RadioCard and Feedback based on current state.\n\n@example\n```jsx\n<RadioCardGroup\n  initialCheckedId=\"card1\"\n  items={[\n    { title: 'Card 1', id: 'card1', content: <Typography>More info</Typography> },\n    { title: 'Card 2', id: 'card2', content: <Typography>Extra content</Typography> },\n    { title: 'Card 3', id: 'card3', content: <Typography>More content</Typography> }\n  ]}\n  legend=\"Cards\"\n  hint=\"Choose a card to select\"\n/>\n```",
         "props": {
+          "copy": {
+            "defaultValue": {
+              "value": "'en'",
+              "computed": false
+            },
+            "type": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'en'",
+                  "computed": false
+                },
+                {
+                  "value": "'fr'",
+                  "computed": false
+                }
+              ]
+            },
+            "required": false,
+            "description": "Whether the English or French copy will be used (e.g. for accessibility labels)."
+          },
           "items": {
             "defaultValue": {
               "value": "[]",
@@ -9308,9 +9518,9 @@
         }
       }
     },
-    "TextInput": {
+    "TextArea": {
       "docs": {
-        "description": "A basic text input component. Use in forms or individually to receive user's input.\nDue to React Native's implementation of `TextInput` it's not possible to access the current value by passing a ref.\n\n## Controlled component\nIf it is required that the state of the `TextInput` be controlled by the application or other external methods,\n`value` and `onChange` props must be passed to the `TextInput`.\nIf the `TextInput` value should not be changed by user input, a `readOnly` prop must be provided.\n\n## Uncontrolled component\nIf it is not necessary to control the `TextInput` state, you can create one without a value prop.\nIn this case its value can be accessed within the `onChange` callback.\n\nNOTE: In order to support more advanced usages all additional props will be passed down to the React Native's\n`TextInput` component. See <a href=\"https://reactnative.dev/docs/textinput\" target=\"_blank\">React Native documentation</a> for\nsupported props and <a href=\"https://reactnative.dev/docs/textinput\" target=\"_blank\">React Native Web documentation</a> for\ntheir implementation on the web.",
+        "description": "Use to collect long-form information such as product feedback or support queries.\nDue to React Native's implementation of `TextInput` it's not possible to access the current value by passing a ref.\nThe `TextArea` height will automatically increase when new lines are added - this behavior can be limited within the theme.\n\n## Controlled component\nIf it is required that the state of the `TextArea` be controlled by the application or other external methods,\n`value` and `onChange` props must be passed to the `TextArea`.\nIf the `TextArea` value should not be changed by user input, a `readOnly` prop must be provided.\n\n## Uncontrolled component\nIf it is not necessary to control the `TextArea` state, you can create one without a value prop.\nIn this case its value can be accessed within the `onChange` callback.\n\n## Getting feedback for entered values\nUse the `feedback` prop to give the user feedback regarding their input.\nYou can affirm that the user's input was correct, or highlight errors that must be corrected, using the `validation` prop.\nKeep feedback text as brief as possible, should be limited to text and links.\n\n## Supplying a hint\nUse the `hint` prop to succinctly clarify attributes of the expected input data, such as the expected format,\nor an indicator that the field is optional.\nIt is a more usable and accessible option than the HTML `placeholder` attribute.",
         "props": {
           "variant": {
             "defaultValue": {
@@ -9376,6 +9586,8 @@
             "type": {
               "name": "custom",
               "raw": {
+                "minLines": "integer",
+                "maxLines": "integer",
                 "backgroundColor": "color",
                 "color": "color",
                 "borderWidth": "border",
@@ -9406,9 +9618,9 @@
         }
       }
     },
-    "TextArea": {
+    "TextInput": {
       "docs": {
-        "description": "Use to collect long-form information such as product feedback or support queries.\nDue to React Native's implementation of `TextInput` it's not possible to access the current value by passing a ref.\nThe `TextArea` height will automatically increase when new lines are added - this behavior can be limited within the theme.\n\n## Controlled component\nIf it is required that the state of the `TextArea` be controlled by the application or other external methods,\n`value` and `onChange` props must be passed to the `TextArea`.\nIf the `TextArea` value should not be changed by user input, a `readOnly` prop must be provided.\n\n## Uncontrolled component\nIf it is not necessary to control the `TextArea` state, you can create one without a value prop.\nIn this case its value can be accessed within the `onChange` callback.\n\n## Getting feedback for entered values\nUse the `feedback` prop to give the user feedback regarding their input.\nYou can affirm that the user's input was correct, or highlight errors that must be corrected, using the `validation` prop.\nKeep feedback text as brief as possible, should be limited to text and links.\n\n## Supplying a hint\nUse the `hint` prop to succinctly clarify attributes of the expected input data, such as the expected format,\nor an indicator that the field is optional.\nIt is a more usable and accessible option than the HTML `placeholder` attribute.",
+        "description": "A basic text input component. Use in forms or individually to receive user's input.\nDue to React Native's implementation of `TextInput` it's not possible to access the current value by passing a ref.\n\n## Controlled component\nIf it is required that the state of the `TextInput` be controlled by the application or other external methods,\n`value` and `onChange` props must be passed to the `TextInput`.\nIf the `TextInput` value should not be changed by user input, a `readOnly` prop must be provided.\n\n## Uncontrolled component\nIf it is not necessary to control the `TextInput` state, you can create one without a value prop.\nIn this case its value can be accessed within the `onChange` callback.\n\nNOTE: In order to support more advanced usages all additional props will be passed down to the React Native's\n`TextInput` component. See <a href=\"https://reactnative.dev/docs/textinput\" target=\"_blank\">React Native documentation</a> for\nsupported props and <a href=\"https://reactnative.dev/docs/textinput\" target=\"_blank\">React Native Web documentation</a> for\ntheir implementation on the web.",
         "props": {
           "variant": {
             "defaultValue": {
@@ -9474,8 +9686,6 @@
             "type": {
               "name": "custom",
               "raw": {
-                "minLines": "integer",
-                "maxLines": "integer",
                 "backgroundColor": "color",
                 "color": "color",
                 "borderWidth": "border",
@@ -9510,6 +9720,27 @@
       "docs": {
         "description": "",
         "props": {
+          "copy": {
+            "defaultValue": {
+              "value": "'en'",
+              "computed": false
+            },
+            "type": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'en'",
+                  "computed": false
+                },
+                {
+                  "value": "'fr'",
+                  "computed": false
+                }
+              ]
+            },
+            "required": false,
+            "description": "Whether the English or French copy will be used (e.g. for accessibility labels)."
+          },
           "accessibilityRole": {
             "defaultValue": {
               "value": "'switch'",
@@ -9647,6 +9878,27 @@
       "docs": {
         "description": "",
         "props": {
+          "copy": {
+            "defaultValue": {
+              "value": "'en'",
+              "computed": false
+            },
+            "type": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'en'",
+                  "computed": false
+                },
+                {
+                  "value": "'fr'",
+                  "computed": false
+                }
+              ]
+            },
+            "required": false,
+            "description": "Whether the English or French copy will be used (e.g. for accessibility labels)."
+          },
           "items": {
             "defaultValue": {
               "value": "[]",
@@ -9721,6 +9973,7 @@
               "name": "custom",
               "raw": {
                 "space": "integer",
+                "fieldSpace": "integer",
                 "direction": "direction",
                 "alignItems": "flexAlign",
                 "justifyContent": "flexJustifyContent",