Add small prop to PeopleSearch components for reduced height

- Add small prop support to PeopleSearch component
- Pass small prop to PeopleSearch in AttendeeSearch
- Use small prop in EventFormFields Participants field
- Use small prop in TempCalendarsInput for left sidebar

src/components/Attendees/AttendeeSearch.tsx

@@ -6,10 +6,12 @@ export default function UserSearch({
   attendees,
   setAttendees,
   disabled,
+  small,
 }: {
   attendees: userAttendee[];
   setAttendees: Function;
   disabled?: boolean;
+  small?: boolean;
 }) {
   const [selectedUsers, setSelectedUsers] = useState(
     attendees.map((a) => ({
@@ -35,6 +37,7 @@ export default function UserSearch({
         selectedUsers={selectedUsers}
         objectTypes={["user", "contact"]}
         disabled={disabled}
+        small={small}
         onChange={(event: any, value: User[]) => {
           setAttendees(
             value.map((a: User) => ({

src/components/Attendees/PeopleSearch.tsx

@@ -30,6 +30,7 @@ export function PeopleSearch({
   freeSolo,
   onToggleEventPreview,
   placeholder,
+  small,
 }: {
   selectedUsers: User[];
   onChange: Function;
@@ -38,6 +39,7 @@ export function PeopleSearch({
   freeSolo?: boolean;
   onToggleEventPreview?: () => void;
   placeholder?: string;
+  small?: boolean;
 }) {
   const { t } = useI18n();
   const [query, setQuery] = useState("");
@@ -151,6 +153,7 @@ export function PeopleSearch({
             </label>
             <TextField
               {...params}
+              size={small ? "small" : "medium"}
               error={!!inputError}
               helperText={inputError}
               placeholder={searchPlaceholder}

src/components/Calendar/CalendarSearch.tsx

@@ -275,6 +275,7 @@ export default function CalendarSearch({
       <PeopleSearch
         objectTypes={["user"]}
         selectedUsers={selectedUsers}
+        small
         onChange={async (event: any, value: User[]) => {
           setSelectedUsers(value);
 

src/components/Calendar/TempCalendarsInput.tsx

@@ -105,6 +105,7 @@ export function TempCalendarsInput({
       onChange={handleUserChange}
       onToggleEventPreview={handleToggleEventPreview}
       placeholder={t("peopleSearch.availabilityPlaceholder")}
+      small
     />
   );
 }

src/components/Event/EventFormFields.tsx

@@ -524,7 +524,11 @@ export default function EventFormFields({
         label={t("event.form.participants")}
         isExpanded={showMore}
       >
-        <AttendeeSelector attendees={attendees} setAttendees={setAttendees} />
+        <AttendeeSelector
+          attendees={attendees}
+          setAttendees={setAttendees}
+          small
+        />
       </FieldWithLabel>
 
       <FieldWithLabel