Replace components with slots in all Joy demos

Author: hbjORbj

docs/data/joy/components/autocomplete/GitHubLabel.js

@@ -131,7 +131,7 @@ export default function GitHubLabel() {
             <Autocomplete
               open
               multiple
-              components={{ listbox: Listbox }}
+              slots={{ listbox: Listbox }}
               onClose={(event, reason) => {
                 if (reason === 'escape') {
                   handleClose();

docs/data/joy/components/autocomplete/Virtualize.js

@@ -117,7 +117,7 @@ export default function Virtualize() {
       <Autocomplete
         sx={{ width: 300 }}
         disableListWrap
-        components={{
+        slots={{
           listbox: ListboxComponent,
         }}
         options={OPTIONS}

docs/data/joy/components/autocomplete/autocomplete.md

@@ -100,11 +100,11 @@ Use the `component` prop to override the `root` slot with a custom element. For
 
 ### Overriding other slots
 
-Use the `components` with keys (the target slots) and values (the custom elements). For example, the following code snippet replaces the default `<ul>` and `<li>` with `div`:
+Use the `slots` with keys (the target slots) and values (the custom elements). For example, the following code snippet replaces the default `<ul>` and `<li>` with `div`:
 
 ```js
 <Autocomplete
-  components={{
+  slots={{
     listbox: 'div',
     option: 'div',
   }}