import type { ServiceDomain } from '../primitive';

export type { ServiceDomain };

/**
 * 현재 서비스 도메인을 `<html data-service-domain>`에 적용한다. brand primitive override가
 * CSS cascade로 전파되어 light/dark 양쪽의 모든 brand 시맨틱이 자동 갱신된다(시맨틱 재정의 0개).
 *
 * 선택 상태의 소유권은 **사용처(consumer)** 에 있다(= IoC). 토큰 패키지는 값을 들고 있지 않고
 * "적용" 방법만 제공한다:
 *
 * ```tsx
 * const [domain, setDomain] = useState<ServiceDomain>('search');
 * useEffect(() => setServiceDomain(domain), [domain]);
 * ```
 *
 * ⚠️ FOUC 회피: 첫 페인트 전에 attribute가 있어야 한다. SSR에서
 * `<html data-service-domain={domain}>`로 렌더하거나 초기 inline script로 심을 것.
 */
export const setServiceDomain = (domain: ServiceDomain) => {
  document.documentElement.setAttribute('data-service-domain', domain);
};