fix(@toss/react): literal type inference

[ojj1123]

Overview

#220

I wrote a PR by modifying the type for defaultValue so that generic is not forced.

TypeScript will infer "a concrete type" if there is a generic type constraint for a primitive type.
Type constraint is applied to useStorageState so that only values that can be serialized as JSON can be received as defaultValue.

However, if defaultValue was set as a primitive type, the state was inferred to be a literal type, and generic had to be created in the following situations.

// No Generic
  const [state, setState, refresh] = useStorageState('key', {
    defaultValue: 0,
  });

  useEffect(() => {
    setState(x => x + 1);
    // ^ type error
  }, []);

// Using Generic
  const [state, setState, refresh] = useStorageState<number>('key', {
    defaultValue: 0,
  });

  useEffect(() => {
    setState(x => x + 1); // No Error
  }, []);

How To Fix

The Serializable type was inferred by dividing it into a primitive type and an object type.
Primitive types must be inferred as primitive types, not literal types (See ToPrimitive<T>), and object types are shallowly inferred, so it's okay to infer T when true for a conditional type (See ToObject<T>).

type ToPrimitive<T> = T extends string ? string : T extends number ? number : T extends boolean ? boolean : never;
type ToObject<T> = T extends unknown[] | Record<string, unknown> ? T : never;
export type Serializable<T> = T extends string | number | boolean ? ToPrimitive<T> : ToObject<T>;

p.s. Tried to solve this PR #223 as well, but state was still inferred as a literal type.

AS-IS

// Need generic
  const [state, setState, refresh] = useStorageState('@service/some-resource', {
    defaultValue: 0,
  });

  state; // 0

TO-BE

// No using generic
  const [state, setState, refresh] = useStorageState('@service/some-resource', {
    defaultValue: 0,
  });

  state; // number

PR Checklist

• I read and included theses actions below

1. I have read the Contributing Guide
2. I have written documents and tests, if needed.

[netlify]

👷 Deploy request for slash-libraries pending review.

Visit the deploys page to approve it

Name	Link
🔨 Latest commit	4c1f8d3

[raon0211]

Thanks, @ojj1123 !