Initial value (applied to URL)

💡

Initial value is applied on initial load.

Use applyInitialValue options to make initial value being applied to URL if it has no search params on load.

const { data, setState, setValue } = useUrlState(
  z.object({
    search: z.string(),
    limit: z.coerce.number().max(100),
    from: z.coerce.date().optional(),
  }),
  {
    search: 'init',
    limit: 1,
    from: new Date('1000-01-01'),
  },
  {
    applyInitialValue: true,
  },
);
 
return (
  <ButtonsGroup>
    <Button
      onClick={() =>
        setState({
          search: 'query',
          limit: 10,
          from: new Date(),
        })
      }
    >
      Set the state
    </Button>
  </ButtonsGroup>
);

Initial value Arrays