From 8770209b3cf20ab648d064e4c7408962aefe01a8 Mon Sep 17 00:00:00 2001
From: JohnDoe6345789 <john.doe6345789@gmail.com>
Date: Thu, 25 Dec 2025 20:41:35 +0000
Subject: [PATCH] docs: tsx,todo,select (2 files)

---
 docs/todo/0-kickstart.md                             | 2 +-
 frontends/nextjs/src/components/molecules/Select.tsx | 7 ++++---
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/docs/todo/0-kickstart.md b/docs/todo/0-kickstart.md
index b366b9649..aeb1873a6 100644
--- a/docs/todo/0-kickstart.md
+++ b/docs/todo/0-kickstart.md
@@ -19,7 +19,7 @@ Use this file when you’re not sure what to do next, or you want a quick “mak
 
 Run from `frontends/nextjs/`:
 
-From repo root: `cd frontends/nextjs`
+From repo root: `cd frontends/nextjs` (or from `docs/todo/`: `cd ../../frontends/nextjs`)
 
 - [ ] `npm ci` (or `npm install`)
 - [ ] `npm run typecheck`
diff --git a/frontends/nextjs/src/components/molecules/Select.tsx b/frontends/nextjs/src/components/molecules/Select.tsx
index 67ba3a245..2da8ff406 100644
--- a/frontends/nextjs/src/components/molecules/Select.tsx
+++ b/frontends/nextjs/src/components/molecules/Select.tsx
@@ -14,20 +14,21 @@ import {
 import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown'
 
 // Select wrapper with FormControl
-export interface SelectProps extends Omit<MuiSelectProps, 'onChange'> {
+export interface SelectProps extends Omit<MuiSelectProps<string>, 'onChange'> {
   onValueChange?: (value: string) => void
   helperText?: ReactNode
 }
 
 const Select = forwardRef<HTMLDivElement, SelectProps>(
-  ({ onValueChange, value, defaultValue, label, error, helperText, children, sx, ...props }, ref) => {
+  ({ onValueChange, value, defaultValue, label, error, helperText, children, sx, variant = 'outlined', ...props }, ref) => {
     return (
       <FormControl ref={ref} fullWidth error={error} sx={sx}>
         {label && <InputLabel>{label}</InputLabel>}
-        <MuiSelect
+        <MuiSelect<string>
           value={value}
           defaultValue={defaultValue}
           label={label}
+          variant={variant}
           onChange={(e) => onValueChange?.(e.target.value as string)}
           IconComponent={KeyboardArrowDownIcon}
           {...props}