DatePicker: format does not changes reactively

[Sovgut]

Description

When user select another format, as example using external selector, DatePicker does not update format after that change, only on initialization or when value changed.

Link to Reproduction (or Detailed Explanation)

https://codesandbox.io/p/devbox/admiring-water-53tz6h

Steps to Reproduce

1. Select any other format using selector
2. DatePicker does not have updated format value

Ark UI Version

4.8.0

Framework

• React
• Solid
• Vue

Browser

Google Chrome

Additional Information

No response

[segunadebayo]

We recommend using latest or live ref when referencing external variables in callbacks.

  const formatRef = useRef(format)
  formatRef.current = format

  const buildFormat = useCallback(
    (date: any) => {
      switch (formatRef.current) {
        case "month":
          return `${date.month}/${date.year}`;
        case "year":
          return `${date.year}`;
        default:
          return `${date.day}/${date.month}/${date.year}`;
      }
    },
    []
  );