Fix conflicting TimePicker component type

Author: b1ink0

packages/frappe-ui-react/src/components/timePicker/timePicker.tsx

@@ -9,7 +9,7 @@ import React from "react";
 import Popover from "../popover/popover";
 import TextInput from "../textInput/textInput";
 import FeatherIcon from "../featherIcon";
-import type { TimePickerProps, Option } from "./types";
+import type { TimePickerProps, TimePickerOption } from "./types";
 import { useTimePicker } from "./useTimePicker";
 
 const TimePicker: React.FC<TimePickerProps> = ({
@@ -72,7 +72,7 @@ const TimePicker: React.FC<TimePickerProps> = ({
     maxTime,
   });
 
-  const getButtonClasses = (opt: Option, idx: number): string => {
+  const getButtonClasses = (opt: TimePickerOption, idx: number): string => {
     if (idx === highlightIndex) return "bg-surface-gray-3 text-ink-gray-8";
     const { selected, nearest } = selectedAndNearest;
     if (isTyping && !selected) {

packages/frappe-ui-react/src/components/timePicker/types.ts

@@ -1,7 +1,7 @@
 import type { ReactNode } from "react";
 import type { Placement } from "@popperjs/core";
 
-export interface Option {
+export interface TimePickerOption {
   value: string;
   label: string;
 }

packages/frappe-ui-react/src/components/timePicker/useTimePicker.ts

@@ -6,7 +6,7 @@ import {
   useCallback,
   useId,
 } from "react";
-import type { Option, TimePickerProps } from "./types";
+import type { TimePickerOption, TimePickerProps } from "./types";
 import {
   findNearestIndex,
   formatDisplay,
@@ -76,7 +76,7 @@ export function useTimePicker({
     });
   }, []);
 
-  const displayedOptions = useMemo<Option[]>(() => {
+  const displayedOptions = useMemo<TimePickerOption[]>(() => {
     if (options.length) {
       return options.map((o) => {
         const val = normalize24(o.value);
@@ -87,7 +87,7 @@ export function useTimePicker({
       });
     }
 
-    const out: Option[] = [];
+    const out: TimePickerOption[] = [];
     for (let m = 0; m < 1440; m += interval) {
       if (minMinutes != null && m < minMinutes) continue;
       if (maxMinutes != null && m > maxMinutes) continue;
@@ -110,7 +110,7 @@ export function useTimePicker({
    * @param valueToMatch - Time value to match against options
    * @returns Matching or nearest option, or null if not found
    */
-  const getTargetOption = useCallback((valueToMatch: string): Option | null => {
+  const getTargetOption = useCallback((valueToMatch: string): TimePickerOption | null => {
     const list = displayedOptions;
     if (!list.length || !valueToMatch) return null;
 
@@ -129,7 +129,7 @@ export function useTimePicker({
   /**
    * Determines which option should be highlighted
    */
-  const selectedAndNearest = useMemo((): { selected: Option | null; nearest: Option | null } => {
+  const selectedAndNearest = useMemo((): { selected: TimePickerOption | null; nearest: TimePickerOption | null } => {
     const candidate = isTyping ? displayValue : internalValue;
     if (!candidate) return { selected: null, nearest: null };
 

packages/frappe-ui-react/src/components/timePicker/utils.ts

@@ -1,4 +1,4 @@
-import { Option } from "./types";
+import { TimePickerOption } from "./types";
 import { ParsedTime } from "./types";
 
 /**
@@ -155,7 +155,7 @@ export const formatDisplay = (val24: string, use12Hr: boolean): string => {
  */
 export function findNearestIndex(
   targetMinutes: number,
-  list: Option[]
+  list: TimePickerOption[]
 ): number {
   if (!list.length) return -1;
   const minutesArr = list.map((o) => {