mirror of
https://github.com/zoriya/v10.git
synced 2026-08-16 02:45:09 +00:00
19 lines
560 B
TypeScript
19 lines
560 B
TypeScript
'use client';
|
|
|
|
import { useId } from 'react';
|
|
|
|
const UNSAFE_CHARS = /[^a-zA-Z0-9_-]/g;
|
|
|
|
/**
|
|
* Generate a CSS-safe identifier from React's `useId()`.
|
|
*
|
|
* `useId()` returns values like `:r0:` which contain colons — invalid
|
|
* in CSS `<dashed-ident>` tokens (used by `anchor-name` / `position-anchor`).
|
|
* This hook strips non-alphanumeric/underscore/hyphen characters and
|
|
* optionally prepends a prefix.
|
|
*/
|
|
export function useSafeId(prefix?: string): string {
|
|
const raw = useId().replace(UNSAFE_CHARS, '');
|
|
return prefix ? `${prefix}-${raw}` : raw;
|
|
}
|