0.2.42

Core Changes

• Add fetchJsonp utility function

0.2.41

Core Changes

• useComponentWillReceiveUpdate now returns whether the props have changed. You can early return your component to skip the JSX creation, so React can re-execute the component function earlier.

0.2.40

Core Changes

• Add createLocalStorageState and createSessionStorageState. Example usage:

// src/context/sidebar-active.tsx
import { createLocalStorageState } from 'foxact/create-local-storage-state';

const [useSidebarActive, useSidebarActiveValue] = createLocalStorageState(
  'sidebar-active', // The localStorage key
  /**
   * The initial value to use if there is no item in the local storage with the provided key,
   * the undefined value will be used if no initial value is provided.
   *
   * Also, the initial value will also be used during the server-side rendering, see below.
   */
  false,
  /**
   * Optional configuration object enables the customization of value serialization before it's stored in local storage.
   */
  {
    // Optional, default to false. When set to "true", the value will be passed to the localStorage API as is.
    raw: false,
    // Optional, default to "JSON.stringify". Can only be specified when the "raw" is set to false (which is the default).
    serializer: JSON.stringify,
    // Optional, default to "JSON.parse". Can only be specified when the "raw" is set to false (which is the default).
    deserializer: JSON.parse,
  }
);

export { useSidebarActive, useSidebarActiveValue };

And now you can use the getter and setter hooks anywhere in your app:

// src/components/sidebar.tsx
import { memo } from 'react';
import { useSidebarActive, useSidebarActiveValue } from '../context/sidebar-active';

function Sidebar() {
  const [sidebarActive, setSidebarActive] = useSidebarActive();
  // If you only need the value, you can use `useSidebarActiveValue` instead:
  const sidebarActive = useSidebarActiveValue();

  return (
    <div className={`sidebar ${sidebarActive ? 'active' : ''}`}>
      <button onClick={() => setSidebarActive(false)}>Close Sidebar</button>
    </div>
  );
}

export default memo(Sidebar);

See the documentation for more information.

0.2.38

Core Changes

• Add useIsOnline, usePageVisibility and useTypeScriptHappyCallback

0.2.36

0.2.36

Core Changes

• Add foxact/types
• createFixedArray now supports GC-friendly array creation when WeakRef is available
  • Created array will be garbage-collected if not used (e.g. all components that use the array are unmounted)

0.2.35

Misc Changes

• Improve the types of useLocalStorage and useSessionStorage.

0.2.34

Core Changes

• Add useMediaQuery

• useCompositionInput now supports <textarea />

  export const Example2 = () => {
    const textareaProps = useCompositionInput<HTMLTextAreaElement>(useCallback((value: string) => {
      // Do something with the value
    }, []));
  
    return (
      <textarea
        {...textareaProps}
        // useCompositionInput is uncontrolled, so you might need to provide defaultValue
        defaultValue={defaultValue}
      />
    );
  }

0.2.28

Core Changes

• Add invariant function
• Add nullthrow function
• Re-implement unstable_useUrlHashState

0.2.27

Core Changes

• Add useSessionStorage
• Improve performance of noSSR

0.2.26

Core Changes

• Allow the deserializer of useLocalStorage to return an un-memoized value