fix: typecheck errors

heroui-inc · Dec 8, 2024 · 84006f2 · 84006f2
1 parent e7f269d
commit 84006f2
Show file tree

Hide file tree

Showing 32 changed files with 59 additions and 59 deletions.
diff --git a/apps/docs/app/examples/table/custom-styles/page.tsx b/apps/docs/app/examples/table/custom-styles/page.tsx
@@ -360,9 +360,9 @@ export default function Page() {
                 </Button>
               </DropdownTrigger>
               <DropdownMenu>
-                <DropdownItem>View</DropdownItem>
-                <DropdownItem>Edit</DropdownItem>
-                <DropdownItem>Delete</DropdownItem>
+                <DropdownItem key="view">View</DropdownItem>
+                <DropdownItem key="edit">Edit</DropdownItem>
+                <DropdownItem key="delete">Delete</DropdownItem>
               </DropdownMenu>
             </Dropdown>
           </div>

diff --git a/apps/docs/app/examples/table/use-case/page.tsx b/apps/docs/app/examples/table/use-case/page.tsx
@@ -352,9 +352,9 @@ export default function Page() {
                 </Button>
               </DropdownTrigger>
               <DropdownMenu>
-                <DropdownItem>View</DropdownItem>
-                <DropdownItem>Edit</DropdownItem>
-                <DropdownItem>Delete</DropdownItem>
+                <DropdownItem key="view">View</DropdownItem>
+                <DropdownItem key="edit">Edit</DropdownItem>
+                <DropdownItem key="delete">Delete</DropdownItem>
               </DropdownMenu>
             </Dropdown>
           </div>

diff --git a/apps/docs/content/components/calendar/controlled-focused-value.raw.tsx b/apps/docs/content/components/calendar/controlled-focused-value.raw.tsx
@@ -6,7 +6,7 @@ import {today, getLocalTimeZone} from "@internationalized/date";
 
 export default function App() {
   let defaultDate = today(getLocalTimeZone());
-  let [focusedDate, setFocusedDate] = React.useState<DateValue>(defaultDate);
+  let [focusedDate, setFocusedDate] = React.useState<DateValue | null>(defaultDate);
 
   return (
     <Calendar

diff --git a/apps/docs/content/components/calendar/controlled.raw.tsx b/apps/docs/content/components/calendar/controlled.raw.tsx
@@ -5,7 +5,7 @@ import {Calendar} from "@nextui-org/react";
 import {parseDate} from "@internationalized/date";
 
 export default function App() {
-  let [value, setValue] = React.useState<DateValue>(parseDate("2024-03-07"));
+  let [value, setValue] = React.useState<DateValue | null>(parseDate("2024-03-07"));
 
   return <Calendar aria-label="Date (Controlled)" value={value} onChange={setValue} />;
 }
diff --git a/apps/docs/content/components/calendar/invalid-date.raw.tsx b/apps/docs/content/components/calendar/invalid-date.raw.tsx
@@ -6,9 +6,9 @@ import {today, getLocalTimeZone, isWeekend} from "@internationalized/date";
 import {useLocale} from "@react-aria/i18n";
 
 export default function App() {
-  let [date, setDate] = React.useState<DateValue>(today(getLocalTimeZone()));
+  let [date, setDate] = React.useState<DateValue | null>(today(getLocalTimeZone()));
   let {locale} = useLocale();
-  let isInvalid = isWeekend(date, locale);
+  let isInvalid = isWeekend(date!, locale);
 
   return (
     <Calendar

diff --git a/apps/docs/content/components/calendar/presets.raw.tsx b/apps/docs/content/components/calendar/presets.raw.tsx
@@ -7,7 +7,7 @@ import {useLocale} from "@react-aria/i18n";
 
 export default function App() {
   let defaultDate = today(getLocalTimeZone());
-  let [value, setValue] = React.useState<DateValue>(defaultDate);
+  let [value, setValue] = React.useState<DateValue | null>(defaultDate);
   let {locale} = useLocale();
 
   let now = today(getLocalTimeZone());

diff --git a/apps/docs/content/components/date-input/controlled.raw.tsx b/apps/docs/content/components/date-input/controlled.raw.tsx
@@ -4,7 +4,7 @@ import {DateValue, parseDate, getLocalTimeZone} from "@internationalized/date";
 import {useDateFormatter} from "@react-aria/i18n";
 
 export default function App() {
-  const [value, setValue] = React.useState<DateValue>(parseDate("2024-04-04"));
+  const [value, setValue] = React.useState<DateValue | null>(parseDate("2024-04-04"));
 
   let formatter = useDateFormatter({dateStyle: "full"});
 

diff --git a/apps/docs/content/components/date-input/granularity.raw.tsx b/apps/docs/content/components/date-input/granularity.raw.tsx
@@ -3,7 +3,7 @@ import {DateInput} from "@nextui-org/react";
 import {DateValue, now, parseAbsoluteToLocal} from "@internationalized/date";
 
 export default function App() {
-  let [date, setDate] = React.useState<DateValue>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
+  let [date, setDate] = React.useState<DateValue | null>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
 
   return (
     <div className="w-full max-w-xl flex flex-col items-start gap-4">

diff --git a/apps/docs/content/components/date-input/international-calendar.raw.tsx b/apps/docs/content/components/date-input/international-calendar.raw.tsx
@@ -4,7 +4,7 @@ import {DateValue, parseAbsoluteToLocal} from "@internationalized/date";
 import {I18nProvider} from "@react-aria/i18n";
 
 export default function App() {
-  const [date, setDate] = React.useState<DateValue>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
+  const [date, setDate] = React.useState<DateValue | null>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
 
   return (
     <div className="flex flex-col gap-4">

diff --git a/apps/docs/content/components/date-picker/controlled.raw.tsx b/apps/docs/content/components/date-picker/controlled.raw.tsx
@@ -4,7 +4,7 @@ import {DateValue, parseDate, getLocalTimeZone} from "@internationalized/date";
 import {useDateFormatter} from "@react-aria/i18n";
 
 export default function App() {
-  const [value, setValue] = React.useState<DateValue>(parseDate("2024-04-04"));
+  const [value, setValue] = React.useState<DateValue | null>(parseDate("2024-04-04"));
 
   let formatter = useDateFormatter({dateStyle: "full"});
 

diff --git a/apps/docs/content/components/date-picker/granularity.raw.tsx b/apps/docs/content/components/date-picker/granularity.raw.tsx
@@ -3,7 +3,7 @@ import {DatePicker} from "@nextui-org/react";
 import {DateValue, now, parseAbsoluteToLocal} from "@internationalized/date";
 
 export default function App() {
-  let [date, setDate] = React.useState<DateValue>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
+  let [date, setDate] = React.useState<DateValue | null>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
 
   return (
     <div className="w-full max-w-xl flex flex-col items-start gap-4">

diff --git a/apps/docs/content/components/date-picker/granularity.ts b/apps/docs/content/components/date-picker/granularity.ts
@@ -35,7 +35,7 @@ const AppTs = `import {DatePicker} from "@nextui-org/react";
 import {DateValue, now, parseAbsoluteToLocal} from "@internationalized/date";
 
 export default function App() {
-  let [date, setDate] = React.useState<DateValue>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
+  let [date, setDate] = React.useState<DateValue | null>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
 
   return (
     <div className="w-full max-w-xl flex flex-col items-start gap-4">

diff --git a/apps/docs/content/components/date-picker/international-calendar.raw.tsx b/apps/docs/content/components/date-picker/international-calendar.raw.tsx
@@ -4,7 +4,7 @@ import {DateValue, parseAbsoluteToLocal} from "@internationalized/date";
 import {I18nProvider} from "@react-aria/i18n";
 
 export default function App() {
-  let [date, setDate] = React.useState<DateValue>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
+  let [date, setDate] = React.useState<DateValue | null>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
 
   return (
     <div className="flex flex-col gap-4">

diff --git a/apps/docs/content/components/date-picker/preset.raw.tsx b/apps/docs/content/components/date-picker/preset.raw.tsx
@@ -12,7 +12,7 @@ import {useLocale, useDateFormatter} from "@react-aria/i18n";
 export default function App() {
   let defaultDate = today(getLocalTimeZone());
 
-  const [value, setValue] = React.useState<DateValue>(defaultDate);
+  const [value, setValue] = React.useState<DateValue | null>(defaultDate);
 
   let {locale} = useLocale();
   let formatter = useDateFormatter({dateStyle: "full"});

diff --git a/apps/docs/content/components/date-range-picker/controlled.raw.tsx b/apps/docs/content/components/date-range-picker/controlled.raw.tsx
@@ -7,7 +7,7 @@ import {parseDate, getLocalTimeZone} from "@internationalized/date";
 import {useDateFormatter} from "@react-aria/i18n";
 
 export default function App() {
-  const [value, setValue] = React.useState<RangeValue<DateValue>>({
+  const [value, setValue] = React.useState<RangeValue<DateValue> | null>({
     start: parseDate("2024-04-01"),
     end: parseDate("2024-04-08"),
   });

diff --git a/apps/docs/content/components/date-range-picker/granularity.raw.tsx b/apps/docs/content/components/date-range-picker/granularity.raw.tsx
@@ -6,7 +6,7 @@ import {DateRangePicker} from "@nextui-org/react";
 import {parseAbsoluteToLocal} from "@internationalized/date";
 
 export default function App() {
-  let [date, setDate] = React.useState<RangeValue<DateValue>>({
+  let [date, setDate] = React.useState<RangeValue<DateValue> | null>({
     start: parseAbsoluteToLocal("2024-04-01T18:45:22Z"),
     end: parseAbsoluteToLocal("2024-04-08T19:15:22Z"),
   });

diff --git a/apps/docs/content/components/date-range-picker/international-calendar.raw.tsx b/apps/docs/content/components/date-range-picker/international-calendar.raw.tsx
@@ -7,7 +7,7 @@ import {parseAbsoluteToLocal} from "@internationalized/date";
 import {I18nProvider} from "@react-aria/i18n";
 
 export default function App() {
-  let [date, setDate] = React.useState<RangeValue<DateValue>>({
+  let [date, setDate] = React.useState<RangeValue<DateValue> | null>({
     start: parseAbsoluteToLocal("2021-04-01T18:45:22Z"),
     end: parseAbsoluteToLocal("2021-04-14T19:15:22Z"),
   });

diff --git a/apps/docs/content/components/range-calendar/presets.raw.tsx b/apps/docs/content/components/range-calendar/presets.raw.tsx
@@ -19,7 +19,7 @@ export default function App() {
     end: today(getLocalTimeZone()).add({weeks: 1, days: 3}),
   });
 
-  let [focusedValue, setFocusedValue] = React.useState<DateValue>(today(getLocalTimeZone()));
+  let [focusedValue, setFocusedValue] = React.useState<DateValue | null>(today(getLocalTimeZone()));
 
   let {locale} = useLocale();
 

diff --git a/apps/docs/content/components/table/custom-styles.raw.jsx b/apps/docs/content/components/table/custom-styles.raw.jsx
@@ -449,9 +449,9 @@ export default function App() {
                 </Button>
               </DropdownTrigger>
               <DropdownMenu>
-                <DropdownItem>View</DropdownItem>
-                <DropdownItem>Edit</DropdownItem>
-                <DropdownItem>Delete</DropdownItem>
+                <DropdownItem key="view">View</DropdownItem>
+                <DropdownItem key="edit">Edit</DropdownItem>
+                <DropdownItem key="delete">Delete</DropdownItem>
               </DropdownMenu>
             </Dropdown>
           </div>

diff --git a/apps/docs/content/components/table/custom-styles.raw.tsx b/apps/docs/content/components/table/custom-styles.raw.tsx
@@ -461,9 +461,9 @@ export default function App() {
                 </Button>
               </DropdownTrigger>
               <DropdownMenu>
-                <DropdownItem>View</DropdownItem>
-                <DropdownItem>Edit</DropdownItem>
-                <DropdownItem>Delete</DropdownItem>
+                <DropdownItem key="view">View</DropdownItem>
+                <DropdownItem key="edit">Edit</DropdownItem>
+                <DropdownItem key="delete">Delete</DropdownItem>
               </DropdownMenu>
             </Dropdown>
           </div>

diff --git a/apps/docs/content/components/table/use-case.raw.jsx b/apps/docs/content/components/table/use-case.raw.jsx
@@ -441,9 +441,9 @@ export default function App() {
                 </Button>
               </DropdownTrigger>
               <DropdownMenu>
-                <DropdownItem>View</DropdownItem>
-                <DropdownItem>Edit</DropdownItem>
-                <DropdownItem>Delete</DropdownItem>
+                <DropdownItem key="view">View</DropdownItem>
+                <DropdownItem key="edit">Edit</DropdownItem>
+                <DropdownItem key="delete">Delete</DropdownItem>
               </DropdownMenu>
             </Dropdown>
           </div>

diff --git a/apps/docs/content/components/table/use-case.raw.tsx b/apps/docs/content/components/table/use-case.raw.tsx
@@ -454,9 +454,9 @@ export default function App() {
                 </Button>
               </DropdownTrigger>
               <DropdownMenu>
-                <DropdownItem>View</DropdownItem>
-                <DropdownItem>Edit</DropdownItem>
-                <DropdownItem>Delete</DropdownItem>
+                <DropdownItem key="view">View</DropdownItem>
+                <DropdownItem key="edit">Edit</DropdownItem>
+                <DropdownItem key="delete">Delete</DropdownItem>
               </DropdownMenu>
             </Dropdown>
           </div>

diff --git a/apps/docs/content/components/time-input/controlled.raw.tsx b/apps/docs/content/components/time-input/controlled.raw.tsx
@@ -6,7 +6,7 @@ import {parseAbsoluteToLocal, Time, ZonedDateTime} from "@internationalized/date
 import {useDateFormatter} from "@react-aria/i18n";
 
 export default function App() {
-  let [value, setValue] = React.useState<TimeInputValue>(
+  let [value, setValue] = React.useState<TimeInputValue | null>(
     parseAbsoluteToLocal("2024-04-08T18:45:22Z"),
   );
 

diff --git a/apps/docs/content/components/time-input/granularity.raw.tsx b/apps/docs/content/components/time-input/granularity.raw.tsx
@@ -5,7 +5,7 @@ import {TimeInput} from "@nextui-org/react";
 import {parseAbsoluteToLocal} from "@internationalized/date";
 
 export default function App() {
-  let [date, setDate] = React.useState<TimeInputValue>(
+  let [date, setDate] = React.useState<TimeInputValue | null>(
     parseAbsoluteToLocal("2021-04-07T18:45:22Z"),
   );
 

diff --git a/packages/components/calendar/stories/calendar.stories.tsx b/packages/components/calendar/stories/calendar.stories.tsx
@@ -55,7 +55,7 @@ const defaultProps = {
 const Template = (args: CalendarProps) => <Calendar {...args} />;
 
 const ControlledTemplate = (args: CalendarProps) => {
-  let [value, setValue] = React.useState<DateValue>(parseDate("2024-03-07"));
+  let [value, setValue] = React.useState<DateValue | null>(parseDate("2024-03-07"));
 
   return (
     <div className="flex flex-wrap gap-4">
@@ -110,7 +110,7 @@ const UnavailableDatesTemplate = (args: CalendarProps) => {
 
 const ControlledFocusedValueTemplate = (args: CalendarProps) => {
   let defaultDate = today(getLocalTimeZone());
-  let [focusedDate, setFocusedDate] = React.useState<DateValue>(defaultDate);
+  let [focusedDate, setFocusedDate] = React.useState<DateValue | null>(defaultDate);
 
   return (
     <div className="flex flex-col gap-4">
@@ -133,7 +133,7 @@ const ControlledFocusedValueTemplate = (args: CalendarProps) => {
 };
 
 const InvalidDateTemplate = (args: CalendarProps) => {
-  let [date, setDate] = React.useState<DateValue>(today(getLocalTimeZone()));
+  let [date, setDate] = React.useState<DateValue | null>(today(getLocalTimeZone()));
   let {locale} = useLocale();
   let isInvalid = isWeekend(date, locale);
 
@@ -161,7 +161,7 @@ const InternationalCalendarsTemplate = (args: CalendarProps) => {
 
 const PresetsTemplate = (args: CalendarProps) => {
   let defaultDate = today(getLocalTimeZone());
-  let [value, setValue] = React.useState<DateValue>(defaultDate);
+  let [value, setValue] = React.useState<DateValue | null>(defaultDate);
   let {locale} = useLocale();
 
   let now = today(getLocalTimeZone());

diff --git a/packages/components/calendar/stories/range-calendar.stories.tsx b/packages/components/calendar/stories/range-calendar.stories.tsx
@@ -141,7 +141,7 @@ const ControlledFocusedValueTemplate = (args: RangeCalendarProps) => {
 };
 
 const InvalidDatesTemplate = (args: RangeCalendarProps) => {
-  let [date, setDate] = React.useState<RangeValue<DateValue>>({
+  let [date, setDate] = React.useState<RangeValue<DateValue> | null>({
     start: today(getLocalTimeZone()),
     end: today(getLocalTimeZone()).add({weeks: 1}),
   });
@@ -172,12 +172,12 @@ const InternationalCalendarsTemplate = (args: RangeCalendarProps) => {
 };
 
 const PresetsTemplate = (args: RangeCalendarProps) => {
-  let [value, setValue] = React.useState<RangeValue<DateValue>>({
+  let [value, setValue] = React.useState<RangeValue<DateValue> | null>({
     start: today(getLocalTimeZone()),
     end: today(getLocalTimeZone()).add({weeks: 1, days: 3}),
   });
 
-  let [focusedValue, setFocusedValue] = React.useState<DateValue>(today(getLocalTimeZone()));
+  let [focusedValue, setFocusedValue] = React.useState<DateValue | null>(today(getLocalTimeZone()));
 
   let {locale} = useLocale();
 

diff --git a/packages/components/date-input/__tests__/date-input.test.tsx b/packages/components/date-input/__tests__/date-input.test.tsx
@@ -294,7 +294,7 @@ describe("DateInput", () => {
 
     it("supports form reset", async () => {
       function Test() {
-        let [value, setValue] = React.useState<DateValue>(new CalendarDate(2020, 2, 3));
+        let [value, setValue] = React.useState<DateValue | null>(new CalendarDate(2020, 2, 3));
 
         return (
           <form>

diff --git a/packages/components/date-input/stories/date-input.stories.tsx b/packages/components/date-input/stories/date-input.stories.tsx
@@ -98,7 +98,7 @@ const LabelPlacementTemplate = (args: DateInputProps) => (
 );
 
 const ControlledTemplate = (args: DateInputProps) => {
-  const [value, setValue] = React.useState<DateValue>(parseDate("2024-04-04"));
+  const [value, setValue] = React.useState<DateValue | null>(parseDate("2024-04-04"));
 
   let formatter = useDateFormatter({dateStyle: "full"});
 
@@ -131,7 +131,7 @@ const TimeZonesTemplate = (args: DateInputProps) => (
 );
 
 const GranularityTemplate = (args: DateInputProps) => {
-  let [date, setDate] = React.useState<DateValue>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
+  let [date, setDate] = React.useState<DateValue | null>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
 
   return (
     <div className="w-full max-w-xl flex flex-col items-start gap-4">
@@ -155,7 +155,7 @@ const GranularityTemplate = (args: DateInputProps) => {
 };
 
 const InternationalCalendarsTemplate = (args: DateInputProps) => {
-  let [date, setDate] = React.useState<DateValue>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
+  let [date, setDate] = React.useState<DateValue | null>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
 
   return (
     <div className="flex flex-col gap-4">

diff --git a/packages/components/date-picker/src/use-date-picker.ts b/packages/components/date-picker/src/use-date-picker.ts
@@ -1,5 +1,5 @@
 import type {DateValue} from "@internationalized/date";
-import type {DateInputProps, TimeInputProps} from "@nextui-org/date-input";
+import type {DateInputProps} from "@nextui-org/date-input";
 import type {DatePickerState} from "@react-stately/datepicker";
 import type {ButtonProps} from "@nextui-org/button";
 import type {CalendarProps} from "@nextui-org/calendar";
@@ -163,7 +163,7 @@ export function useDatePicker<T extends DateValue>({
     } as DateInputProps;
   };
 
-  const getTimeInputProps = (): TimeInputProps => {
+  const getTimeInputProps = () => {
     if (!showTimeField) return {};
 
     return {

diff --git a/packages/components/date-picker/stories/date-picker.stories.tsx b/packages/components/date-picker/stories/date-picker.stories.tsx
@@ -114,7 +114,7 @@ const LabelPlacementTemplate = (args: DatePickerProps) => (
 );
 
 const ControlledTemplate = (args: DatePickerProps) => {
-  const [value, setValue] = React.useState<DateValue>(parseDate("2024-04-04"));
+  const [value, setValue] = React.useState<DateValue | null>(parseDate("2024-04-04"));
 
   let formatter = useDateFormatter({dateStyle: "full"});
 
@@ -149,7 +149,7 @@ const TimeZonesTemplate = (args: DatePickerProps) => (
 );
 
 const GranularityTemplate = (args: DatePickerProps) => {
-  let [date, setDate] = React.useState<DateValue>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
+  let [date, setDate] = React.useState<DateValue | null>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
 
   return (
     <div className="w-full max-w-xl flex flex-col items-start gap-4">
@@ -182,7 +182,7 @@ const GranularityTemplate = (args: DatePickerProps) => {
 };
 
 const InternationalCalendarsTemplate = (args: DatePickerProps) => {
-  let [date, setDate] = React.useState<DateValue>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
+  let [date, setDate] = React.useState<DateValue | null>(parseAbsoluteToLocal("2021-04-07T18:45:22Z"));
 
   return (
     <div className="flex flex-col gap-4">
@@ -202,7 +202,7 @@ const InternationalCalendarsTemplate = (args: DatePickerProps) => {
 const PresetsTemplate = (args: DatePickerProps) => {
   let defaultDate = today(getLocalTimeZone());
 
-  const [value, setValue] = React.useState<DateValue>(defaultDate);
+  const [value, setValue] = React.useState<DateValue | null>(defaultDate);
 
   let {locale} = useLocale();
   let formatter = useDateFormatter({dateStyle: "full"});