fix(ui): enforce canonical inspector selects

packages/ui-react/src/Select.tsx

@@ -1,6 +1,7 @@
-import { useMemo, useState, type KeyboardEvent, type ReactNode } from "react";
+import { useContext, useMemo, useState, type KeyboardEvent, type ReactNode } from "react";
 import type { FloatingPlacement } from "@nodedc/ui-core";
 import { Dropdown } from "./Dropdown.js";
+import { InspectorSelectPolicyContext } from "./InspectorContext.js";
 import { cn } from "./cn.js";
 
 export interface SelectOption<T extends string> {
@@ -48,6 +49,8 @@ export function Select<T extends string>({
   triggerClassName,
   menuClassName,
 }: SelectProps<T>) {
+  const inspectorSplitRequired = useContext(InspectorSelectPolicyContext);
+  const resolvedVariant: SelectVariant = inspectorSplitRequired ? "split" : variant;
   const [query, setQuery] = useState("");
   const selected = options.find((option) => option.value === value) ?? options[0];
   const visibleOptions = useMemo(() => {
@@ -64,23 +67,24 @@ export function Select<T extends string>({
       width={menuWidth}
       disabled={disabled}
       surfaceRole="listbox"
-      surfaceClassName={cn(variant === "split" && "nodedc-select__menu", menuClassName)}
-      trigger={({ open, toggle, setTriggerRef, surfaceId }) => {
+      surfaceClassName={cn(resolvedVariant === "split" && "nodedc-select__menu", menuClassName)}
+      trigger={({ open, toggle, setAnchorRef, setTriggerRef, surfaceId }) => {
         const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {
           if (event.key === "ArrowDown" || event.key === "Enter" || event.key === " ") {
             event.preventDefault();
             if (!open) toggle();
           }
         };
-        if (variant === "split") {
+        if (resolvedVariant === "split") {
           return (
-            <div className={cn("nodedc-select", triggerClassName)}>
-              <div ref={setTriggerRef} className="nodedc-select__control">
+            <div className={cn("nodedc-select", triggerClassName)} data-disabled={disabled ? "true" : undefined}>
+              <div ref={setAnchorRef} className="nodedc-select__control">
                 <div className="nodedc-select__value">
                   {selected?.icon ? <span className="nodedc-select__value-icon">{selected.icon}</span> : null}
                   <span>{selected?.label ?? "—"}</span>
                 </div>
                 <button
+                  ref={setTriggerRef}
                   type="button"
                   className="nodedc-select__toggle"
                   aria-label={label}