Merge branch 'master' into composite-reorder

Author: atomiks

.github/workflows/ci.yml

@@ -29,7 +29,7 @@ jobs:
       - name: Set up pnpm
         uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0
       - name: Use Node.js 22.x
-        uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.4.0
+        uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5.0.0
         with:
           node-version: '22.18'
           cache: 'pnpm' # https://github.com/actions/setup-node/blob/main/docs/advanced-usage.md#caching-packages-dependencies

.github/workflows/ensure-triage-label.yml

@@ -16,7 +16,7 @@ jobs:
     permissions:
       issues: write
     steps:
-      - uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+      - uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
         with:
           script: |
             const { data: labels } = await github.rest.issues.listLabelsOnIssue({

.github/workflows/fixed-issue.yml

@@ -15,7 +15,7 @@ jobs:
     steps:
       - name: Get associated PRs
         id: get-prs
-        uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+        uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
         with:
           script: |
             const issue_number = context.payload.issue.number;
@@ -109,7 +109,7 @@ jobs:
 
       - name: Add comment to issue
         if: steps.get-prs.outputs.has_pr == 'true'
-        uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+        uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
         with:
           script: |
             // Get PR number from the previous step's output

docs/package.json

@@ -21,7 +21,6 @@
     "@emotion/styled": "^11.14.1",
     "@mdx-js/loader": "^3.1.1",
     "@mdx-js/react": "^3.1.1",
-    "@mui/system": "7.3.2",
     "@next/mdx": "^15.5.2",
     "@react-spring/web": "^10.0.1",
     "@stefanprobst/rehype-extract-toc": "^3.0.0",

docs/reference/generated/autocomplete-root.json

@@ -46,7 +46,7 @@
     "autoHighlight": {
       "type": "boolean",
       "default": "false",
-      "description": "Whether to automatically highlight the first item when the popup opens.",
+      "description": "Whether to automatically highlight the first item while filtering.",
       "detailedType": "boolean | undefined"
     },
     "cols": {

docs/reference/generated/collapsible-panel.json

@@ -9,9 +9,9 @@
       "detailedType": "boolean | undefined"
     },
     "className": {
-      "type": "string | ((state: Collapsible.Root.State) => string)",
+      "type": "string | ((state: Collapsible.Panel.State) => string)",
       "description": "CSS class applied to the element, or a function that\nreturns a class based on the component’s state.",
-      "detailedType": "| string\n| ((state: Collapsible.Root.State) => string)"
+      "detailedType": "| string\n| ((state: Collapsible.Panel.State) => string)"
     },
     "keepMounted": {
       "type": "boolean",
@@ -20,9 +20,9 @@
       "detailedType": "boolean | undefined"
     },
     "render": {
-      "type": "ReactElement | ((props: HTMLProps, state: Collapsible.Root.State) => ReactElement)",
+      "type": "ReactElement | ((props: HTMLProps, state: Collapsible.Panel.State) => ReactElement)",
       "description": "Allows you to replace the component’s HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render.",
-      "detailedType": "| ReactElement\n| ((\n    props: HTMLProps,\n    state: Collapsible.Root.State,\n  ) => ReactElement)"
+      "detailedType": "| ReactElement\n| ((\n    props: HTMLProps,\n    state: Collapsible.Panel.State,\n  ) => ReactElement)"
     }
   },
   "dataAttributes": {

docs/reference/generated/combobox-root.json

@@ -43,6 +43,12 @@
       "description": "A ref to imperative actions.\n- `unmount`: When specified, the combobox will not be unmounted when closed.\nInstead, the `unmount` function must be called to unmount the combobox manually.\nUseful when the combobox's animation is controlled by an external library.",
       "detailedType": "React.RefObject<Combobox.Root.Actions> | undefined"
     },
+    "autoHighlight": {
+      "type": "boolean",
+      "default": "false",
+      "description": "Whether to automatically highlight the first item while filtering.",
+      "detailedType": "boolean | undefined"
+    },
     "cols": {
       "type": "number",
       "default": "1",

docs/reference/generated/slider-root.json

@@ -83,11 +83,6 @@
       "description": "The component orientation.",
       "detailedType": "'horizontal' | 'vertical' | undefined"
     },
-    "inputRef": {
-      "type": "Ref<HTMLInputElement>",
-      "description": "A ref to access the hidden input element.",
-      "detailedType": "React.Ref<HTMLInputElement> | undefined"
-    },
     "className": {
       "type": "string | ((state: Slider.Root.State) => string)",
       "description": "CSS class applied to the element, or a function that\nreturns a class based on the component’s state."

docs/reference/generated/slider-thumb.json

@@ -39,6 +39,11 @@
       "description": "Whether the thumb should ignore user interaction.",
       "detailedType": "boolean | undefined"
     },
+    "inputRef": {
+      "type": "Ref<HTMLInputElement>",
+      "description": "A ref to access the nested input element.",
+      "detailedType": "React.Ref<HTMLInputElement> | undefined"
+    },
     "className": {
       "type": "string | ((state: Slider.Thumb.State) => string)",
       "description": "CSS class applied to the element, or a function that\nreturns a class based on the component’s state."

docs/scripts/generateLlmTxt/__snapshots__/mdxToMarkdown.test.mjs.snap

@@ -409,7 +409,7 @@ export default function ExampleDirectionProvider() {
           <Slider.Control className="flex w-56 items-center py-3">
             <Slider.Track className="relative h-1 w-full rounded bg-gray-200 shadow-[inset_0_0_0_1px] shadow-gray-200">
               <Slider.Indicator className="rounded bg-gray-700" />
-              <Slider.Thumb className="size-4 rounded-full bg-white outline outline-1 outline-gray-300 focus-visible:outline focus-visible:outline-2 focus-visible:outline-blue-800" />
+              <Slider.Thumb className="size-4 rounded-full bg-white outline outline-1 outline-gray-300 has-[:focus-visible]:outline has-[:focus-visible]:outline-2 has-[:focus-visible]:outline-blue-800" />
             </Slider.Track>
           </Slider.Control>
         </Slider.Root>
@@ -455,7 +455,7 @@ This example shows how to implement the component using CSS Modules.
   background-color: white;
   outline: 1px solid var(--color-gray-300);
 
-  &:focus-visible {
+  &:has(:focus-visible) {
     outline: 2px solid var(--color-blue);
   }
 }