utils.ts 571 B

123456789101112131415161718192021
  1. import { type ClassValue, clsx } from 'clsx'
  2. import { twMerge } from 'tailwind-merge'
  3. import { createContext, useContext, useRef } from 'react'
  4. export function cn(...inputs: ClassValue[]) {
  5. return twMerge(clsx(inputs))
  6. }
  7. const idRef = { default: 0 }
  8. const Id = createContext<() => number>(() => {
  9. return ++idRef.default
  10. })
  11. // NOTE: compatible for React 18 (useId hook)
  12. export const useId = (prefix: string = 'id') => {
  13. const getter = useContext(Id)
  14. const ref = useRef<string>()
  15. if (!ref.current) ref.current = `${prefix}:${getter()}`
  16. return ref.current
  17. }