refactor: enable exactOptionalPropertyTypes everywhere

packages/core/src/types.ts

@@ -125,10 +125,10 @@ export declare namespace StateMachine {
    * -----------------------------------------------------------------------------*/
 
   export type TransitionDefinition<TContext extends Dict, TState extends StateSchema, TEvent extends EventObject> = {
-    target?: TState["value"]
-    actions?: Actions<TContext, TState, TEvent>
-    guard?: Guard<TContext, TState, TEvent>
-    internal?: boolean
+    target?: TState["value"] | undefined
+    actions?: Actions<TContext, TState, TEvent> | undefined
+    guard?: Guard<TContext, TState, TEvent> | undefined
+    internal?: boolean | undefined
   }
 
   export type DelayExpression<TContext extends Dict, TEvent extends EventObject> = Expression<TContext, TEvent, number>
@@ -151,7 +151,7 @@ export declare namespace StateMachine {
     /**
      * The time to delay the event, in milliseconds.
      */
-    delay?: Delay<TContext, TEvent>
+    delay?: Delay<TContext, TEvent> | undefined
   }
 
   export type DelayedTransitions<TContext extends Dict, TState extends StateSchema, TEvent extends EventObject> =
@@ -178,6 +178,7 @@ export declare namespace StateMachine {
     [K in TEvent["type"]]?:
       | TState["value"]
       | MaybeArray<TransitionDefinition<TContext, TState, ExtractEvent<TEvent, K>>>
+      | undefined
   }
 
   /* -----------------------------------------------------------------------------
@@ -188,37 +189,37 @@ export declare namespace StateMachine {
     /**
      * The type of this state node.
      */
-    type?: "final"
+    type?: "final" | undefined
     /**
      * The tags for the state node.
      */
-    tags?: MaybeArray<TState["tags"] extends string ? TState["tags"] : string>
+    tags?: MaybeArray<TState["tags"] extends string ? TState["tags"] : string> | undefined
     /**
      * The activities to be started upon entering the state node,
      * and stopped upon exiting the state node.
      */
-    activities?: Activities<TContext, TState, TEvent>
+    activities?: Activities<TContext, TState, TEvent> | undefined
     /**
      * The mapping of event types to their potential transition(s).
      */
-    on?: TransitionDefinitionMap<TContext, TState, TEvent>
+    on?: TransitionDefinitionMap<TContext, TState, TEvent> | undefined
     /**
      * The action(s) to be executed upon entering the state node.
      */
-    entry?: Actions<TContext, TState, TEvent>
+    entry?: Actions<TContext, TState, TEvent> | undefined
     /**
      * The action(s) to be executed upon exiting the state node.
      */
-    exit?: Actions<TContext, TState, TEvent>
+    exit?: Actions<TContext, TState, TEvent> | undefined
     /**
      * The meta data associated with this state node.
      */
-    meta?: string | Dict
+    meta?: string | Dict | undefined
     /**
      * The mapping (or array) of delays (in `ms`) to their potential transition(s) to run after
      * the specified delay. Uses `setTimeout` under the hood.
      */
-    after?: DelayedTransitions<TContext, TState, TEvent>
+    after?: DelayedTransitions<TContext, TState, TEvent> | undefined
     /**
      * The mapping (or array) of intervals (in `ms`) to their potential actions(s) to run at interval.
      *  Uses `setInterval` under the hood.
@@ -230,6 +231,7 @@ export declare namespace StateMachine {
           actions: Actions<TContext, TState, TEvent>
           guard?: Guard<TContext, TState, TEvent>
         }>
+      | undefined
   }
 
   /* -----------------------------------------------------------------------------
@@ -272,13 +274,13 @@ export declare namespace StateMachine {
 
   export type StateSchema = {
     value: string
-    tags?: string
+    tags?: string | undefined
   }
 
   export type StateInitObject<TContext, TState extends StateSchema> = {
-    context?: TContext
+    context?: TContext | undefined
     value: TState["value"] | null
-    tags?: TState["tags"][]
+    tags?: TState["tags"][] | undefined
   }
 
   export type StateInit<TContext, TState extends StateSchema> = StateInitObject<TContext, TState>
@@ -306,49 +308,49 @@ export declare namespace StateMachine {
      * Function called synchronously after the machine has been instantiated,
      * before it is started.
      */
-    created?: Actions<TContext, TState, TEvent>
+    created?: Actions<TContext, TState, TEvent> | undefined
     /**
      * The actions to run when the machine has started. This is usually
      * called in the `beforeMount`, `onMount` or `useLayoutEffect` lifecycle methods.
      */
-    entry?: Actions<TContext, TState, TEvent>
+    entry?: Actions<TContext, TState, TEvent> | undefined
     /**
      * The actions to run when the machine has stopped. This is usually
      * called in the `onUnmount` or `useLayoutEffect` cleanup lifecycle methods.
      */
-    exit?: Actions<TContext, TState, TEvent>
+    exit?: Actions<TContext, TState, TEvent> | undefined
     /**
      * The root level activities to run when the machine is started
      */
-    activities?: Activities<TContext, TState, TEvent>
+    activities?: Activities<TContext, TState, TEvent> | undefined
     /**
      * The unique identifier for the invoked machine.
      */
-    id?: string
+    id?: string | undefined
     /**
      * The extended state used to store `data` for your machine
      */
-    context?: Writable<TContext>
+    context?: Writable<TContext> | undefined
     /**
      * A generic way to react to context value changes
      */
-    watch?: { [K in keyof TContext]?: Actions<TContext, TState, TEvent> }
+    watch?: { [K in keyof TContext]?: Actions<TContext, TState, TEvent> } | undefined
     /**
      * The computed properties based on the state
      */
-    computed?: Partial<TComputedContext<TContext>>
+    computed?: Partial<TComputedContext<TContext>> | undefined
     /**
      * The initial state to start with
      */
-    initial?: TState["value"]
+    initial?: TState["value"] | undefined
     /**
      * The mapping of state node keys to their state node configurations (recursive).
      */
-    states?: Partial<Record<TState["value"], StateNode<TContext, TState, TEvent>>>
+    states?: Partial<Record<TState["value"], StateNode<TContext, TState, TEvent>>> | undefined
     /**
      * Mapping events to transitions
      */
-    on?: TransitionDefinitionMap<TContext, TState, TEvent>
+    on?: TransitionDefinitionMap<TContext, TState, TEvent> | undefined
   }
 
   export interface State<
@@ -375,19 +377,19 @@ export declare namespace StateMachine {
    * -----------------------------------------------------------------------------*/
 
   export interface MachineOptions<TContext extends Dict, TState extends StateSchema, TEvent extends EventObject> {
-    debug?: boolean
-    guards?: GuardMap<TContext, TState, TEvent>
-    actions?: ActionMap<TContext, TState, TEvent>
-    delays?: DelayMap<TContext, TEvent>
-    activities?: ActivityMap<TContext, TState, TEvent>
-    sync?: boolean
-    compareFns?: { [K in keyof TContext]?: CompareFn<TContext[K]> }
+    debug?: boolean | undefined
+    guards?: GuardMap<TContext, TState, TEvent> | undefined
+    actions?: ActionMap<TContext, TState, TEvent> | undefined
+    delays?: DelayMap<TContext, TEvent> | undefined
+    activities?: ActivityMap<TContext, TState, TEvent> | undefined
+    sync?: boolean | undefined
+    compareFns?: { [K in keyof TContext]?: CompareFn<TContext[K]> } | undefined
   }
 
   export type HookOptions<TContext extends Dict, TState extends StateSchema, TEvent extends EventObject> = {
-    actions?: ActionMap<TContext, TState, TEvent>
-    state?: StateInit<TContext, TState>
-    context?: UserContext<TContext>
+    actions?: ActionMap<TContext, TState, TEvent> | undefined
+    state?: StateInit<TContext, TState> | undefined
+    context?: UserContext<TContext> | undefined
   }
 
   export type Self<TContext extends Dict, TState extends StateSchema, TEvent extends EventObject> = {

packages/core/tests/transition.test.ts

@@ -1,7 +1,7 @@
 import { expect, vi, test } from "vitest"
 import { createMachine } from ".."
 
-function getMachine(debug?: boolean) {
+function getMachine(debug?: boolean | undefined) {
   const checked = { entry: vi.fn(), exit: vi.fn() }
   const unchecked = { entry: vi.fn(), exit: vi.fn() }
 

packages/machines/color-picker/src/utils/get-slider-background.ts

@@ -1,6 +1,9 @@
 import type { ChannelProps, Color, MachineContext } from "../color-picker.types"
 
-function getSliderBackgroundDirection(orientation: "vertical" | "horizontal", dir: "ltr" | "rtl") {
+function getSliderBackgroundDirection(
+  orientation: "vertical" | "horizontal" | undefined,
+  dir: "ltr" | "rtl" | undefined,
+) {
   if (orientation === "vertical") {
     return "top"
   } else if (dir === "ltr") {
@@ -16,8 +19,8 @@ interface SliderBackgroundProps extends Required<ChannelProps> {
 }
 
 export const getSliderBackground = (props: SliderBackgroundProps) => {
-  const { channel, value, dir } = props
-  const bgDirection = getSliderBackgroundDirection(props.orientation, dir!)
+  const { channel, value, dir, orientation } = props
+  const bgDirection = getSliderBackgroundDirection(orientation, dir)
   const { minValue, maxValue } = value.getChannelRange(channel)
 
   switch (channel) {

packages/machines/date-picker/src/date-picker.connect.ts

@@ -89,7 +89,7 @@ export function connect<T extends PropTypes>(state: State, send: Send, normalize
     return getMonthDays(from, locale, numOfWeeks, startOfWeek)
   }
 
-  function getMonths(props: { format?: "short" | "long" } = {}) {
+  function getMonths(props: { format?: "short" | "long" | undefined } = {}) {
     const { format } = props
     return getMonthNames(locale, format).map((label, index) => ({ label, value: index + 1 }))
   }

packages/machines/date-picker/src/date-picker.machine.ts

@@ -801,11 +801,11 @@ export function machine(userContext: UserDefinedContext) {
         },
         focusFirstYear(ctx) {
           const range = getDecadeRange(ctx.focusedValue.year)
-          set.focusedValue(ctx, ctx.focusedValue.set({ year: range.at(0) }))
+          set.focusedValue(ctx, ctx.focusedValue.set({ year: range[0] }))
         },
         focusLastYear(ctx) {
           const range = getDecadeRange(ctx.focusedValue.year)
-          set.focusedValue(ctx, ctx.focusedValue.set({ year: range.at(-1) }))
+          set.focusedValue(ctx, ctx.focusedValue.set({ year: range[range.length - 1] }))
         },
         setActiveIndex(ctx, evt) {
           ctx.activeIndex = evt.index

packages/machines/dialog/src/dialog.machine.ts

@@ -142,7 +142,7 @@ export function machine(userContext: UserDefinedContext) {
               escapeDeactivates: false,
               preventScroll: true,
               fallbackFocus: contentEl,
-              returnFocusOnDeactivate: ctx.restoreFocus,
+              returnFocusOnDeactivate: !!ctx.restoreFocus,
               allowOutsideClick: true,
               initialFocus: ctx.initialFocusEl?.() ?? undefined,
               setReturnFocus(triggerEl) {

packages/machines/splitter/src/splitter.types.ts

@@ -1,5 +1,5 @@
 import type { Machine, StateMachine as S } from "@zag-js/core"
-import type { CommonProperties, DirectionProperty, PropTypes, RequiredBy } from "@zag-js/types"
+import type { CommonProperties, DirectionProperty, PropTypes, Required, RequiredBy } from "@zag-js/types"
 
 /* -----------------------------------------------------------------------------
  * Callback details

packages/machines/tour/src/tour.types.ts

@@ -1,7 +1,7 @@
 import type { Machine, StateMachine as S } from "@zag-js/core"
 import type { InteractOutsideHandlers } from "@zag-js/dismissable"
 import type { AnchorRect, Placement } from "@zag-js/popper"
-import type { CommonProperties, DirectionProperty, PropTypes, RequiredBy } from "@zag-js/types"
+import type { CommonProperties, DirectionProperty, PropTypes, Required, RequiredBy } from "@zag-js/types"
 import type { Point } from "./utils/rect"
 
 /* -----------------------------------------------------------------------------

packages/machines/tour/src/utils/clip-path.ts

@@ -1,4 +1,5 @@
 import type { AnchorRect } from "@zag-js/popper"
+import type { Required } from "@zag-js/types"
 
 interface CompositeRadius {
   topLeft: number

packages/types/src/index.ts

@@ -2,6 +2,12 @@ import type { JSX } from "./jsx"
 
 export type RequiredBy<T, K extends keyof T> = Partial<Omit<T, K>> & Required<Pick<T, K>>
 
+export type NonNullable<T> = T extends null | undefined ? never : T
+
+export type Required<T> = {
+  [P in keyof T]-?: NonNullable<T[P]>
+}
+
 export type Direction = "ltr" | "rtl"
 
 export type Orientation = "horizontal" | "vertical"

packages/utilities/collection/src/tree-collection.ts

@@ -1,13 +1,13 @@
 export interface TreeNodeOptions {
   value: string
-  data?: any
+  data?: any | undefined
   children?: TreeNodeOptions[]
 }
 
 export interface FlatTreeNode {
   value: string
-  parentValue?: string
-  data?: any
+  parentValue?: string | undefined
+  data?: any | undefined
 }
 
 export const enum TreeNodePosition {

packages/utilities/dom-event/src/get-point-value.ts

@@ -2,15 +2,15 @@ function clamp(value: number) {
   return Math.max(0, Math.min(1, value))
 }
 
-export type Point = {
+export interface Point {
   x: number
   y: number
 }
 
-type PercentValueOptions = {
-  inverted?: boolean | { x?: boolean; y?: boolean }
-  dir?: "ltr" | "rtl"
-  orientation?: "vertical" | "horizontal"
+export interface PercentValueOptions {
+  inverted?: boolean | { x?: boolean; y?: boolean } | undefined
+  dir?: "ltr" | "rtl" | undefined
+  orientation?: "vertical" | "horizontal" | undefined
 }
 
 export function getRelativePoint(point: Point, element: HTMLElement) {

packages/utilities/dom-query/src/scope.ts

@@ -1,7 +1,7 @@
 import { getActiveElement, getDocument } from "./env"
 
 export interface ScopeContext {
-  getRootNode?(): Document | ShadowRoot | Node
+  getRootNode?: (() => Document | ShadowRoot | Node) | undefined
 }
 
 export function createScope<T>(methods: T) {

packages/utilities/file-utils/src/download-file.ts

@@ -3,15 +3,15 @@ export function isMSEdge(win: Window): win is Window & { navigator: { msSaveOrOp
   return Boolean(win.navigator && win.navigator.msSaveOrOpenBlob)
 }
 
-interface DownloadFileOptions {
+export interface DownloadFileOptions {
   /**
    * The name of the file
    */
   name?: string | undefined
   /**
    * The MIME type of the file
    */
-  type?: string | undefined
+  type: string
   /**
    * The file contents
    */