refactor: upgrade base-ui

apps/client/package.json

@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "dependencies": {
-    "@base-ui-components/react": "1.0.0-beta.0",
+    "@base-ui-components/react": "1.0.0-beta.1",
     "@chakra-ui/react": "^2.7.0",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",

apps/client/src/common/components/select/Select.tsx

@@ -11,7 +11,6 @@ interface SelectProps<T extends string | null = string> {
     label: string;
     disabled?: boolean; // exposed to allow creating a non-selectable option
   }[];
-  placeholder?: string;
   value?: T;
   onChange?: (value: NonNullable<T>) => void;
 }
@@ -19,14 +18,13 @@ interface SelectProps<T extends string | null = string> {
 export default function Select<T extends string | null = string>({
   defaultValue,
   options,
-  placeholder,
   value,
   onChange,
 }: SelectProps<T>) {
   return (
-    <BaseSelect.Root defaultValue={defaultValue} onValueChange={onChange} value={value}>
+    <BaseSelect.Root items={options} defaultValue={defaultValue} onValueChange={onChange} value={value}>
       <BaseSelect.Trigger className={styles.select}>
-        <BaseSelect.Value placeholder={placeholder} />
+        <BaseSelect.Value />
         <BaseSelect.Icon className={styles.selectIcon}>
           <LuChevronsUpDown />
         </BaseSelect.Icon>

apps/client/src/features/control/message/TimerViewControl.tsx

@@ -73,7 +73,6 @@ function SecondarySourceControl() {
     <>
       <Select
         value={value}
-        placeholder='Secondary source'
         options={[
           { value: 'aux1', label: 'Aux 1' },
           { value: 'aux2', label: 'Aux 2' },

apps/client/src/features/rundown/entry-editor/composite/EventEditorTriggers.tsx

@@ -70,14 +70,12 @@ function EventTriggerForm({ eventId, triggers }: EventTriggerFormProps) {
     <div className={style.triggerForm}>
       <Select
         value={cycleValue}
-        placeholder='Choose a trigger'
         onChange={(value) => setCycleValue(value)}
         options={eventTriggerOptions.map((cycle) => ({ value: cycle, label: cycle }))}
       />
 
       <Select
         value={automationId}
-        placeholder='Choose an automation'
         onChange={(value) => setAutomationId(value)}
         options={Object.values(automationSettings.automations).map(({ id, title }) => ({ value: id, label: title }))}
       />