feat: add shared Select facade

src/components/select.tsx

@@ -0,0 +1,29 @@
+import { Select as AntSelect, type SelectProps as AntSelectProps } from 'antd';
+
+import { cn } from '../lib';
+
+/**
+ * The shared select entry point. It deliberately keeps Ant Design's option
+ * model intact while making sizing, invalid state and the stable ui-select
+ * hook part of the product contract.
+ */
+export interface SelectProps<ValueType = unknown> extends AntSelectProps<ValueType> {
+  invalid?: boolean;
+}
+
+export function Select<ValueType = unknown>({
+  className,
+  invalid,
+  status,
+  'aria-invalid': ariaInvalid,
+  ...props
+}: SelectProps<ValueType>) {
+  return (
+    <AntSelect<ValueType>
+      className={cn('ui-select', className)}
+      status={invalid ? 'error' : status}
+      aria-invalid={(ariaInvalid ?? invalid) || undefined}
+      {...props}
+    />
+  );
+}

src/index.ts

@@ -53,6 +53,7 @@ export {
   DropdownMenuTrigger,
 } from './components/dropdown-menu';
 export { Input, type InputProps } from './components/input';
+export { Select, type SelectProps } from './components/select';
 export { Skeleton } from './components/skeleton';
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './components/tooltip';
 export { AppShell, type AppShellProps } from './patterns/app-shell';

src/styles/components.css

@@ -81,6 +81,10 @@
   width: 100%;
 }
 
+.ui-select.ant-select {
+  width: 100%;
+}
+
 .ui-card__header {
   display: flex;
   flex-direction: column;

tests/primitives.test.tsx

@@ -19,6 +19,7 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
   Input,
+  Select,
   Skeleton,
   Tooltip,
   TooltipContent,
@@ -46,6 +47,20 @@ describe('core primitives', () => {
     );
   });
 
+  it('renders the shared select with a stable hook and invalid state', () => {
+    render(
+      <Select
+        aria-label="Workspace scope"
+        invalid
+        value="project"
+        options={[{ value: 'project', label: 'Project' }]}
+      />,
+    );
+    const select = screen.getByRole('combobox', { name: 'Workspace scope' });
+    expect(select.closest('.ui-select')).toBeInTheDocument();
+    expect(select).toHaveAttribute('aria-invalid', 'true');
+  });
+
   it('forwards a native input ref for focus, selection and DOM listeners', () => {
     const ref = createRef<HTMLInputElement>();
     const { unmount } = render(