OPEN_GRID API - v1.5.2
    Preparing search index...

    Function applyTypography

    • 프리셋을 적용한다. 코어 무수정 경로.

      두 경로가 있고, 능력이 다르다. 정직하게 밝힌다.

      1. target 이 HTMLElement(그리드 컨테이너 = .og-container)이면 data-og-typography 속성을 붙인다. typography.css 의 프리셋 블록·밀도 복합 셀렉터(광학 크기)·:lang() 한자 분기까지 전부 살아난다. 이 경로가 완전판이며, open-grid-typography.css 로드가 전제다 (값을 인라인하지 않는 이유: 인라인은 복합 셀렉터 보정을 덮어버린다).
      2. target 이 그리드 인스턴스이면 공개 setThemeVar() 로 9개 토큰을 인라인 주입한다. OpenGrid 는 컨테이너 요소를 반환하는 공개 접근자를 제공하지 않으므로(2026-08 조사 결과: _container 는 private, 공개 표면에 getter 없음) 속성을 붙일 방법이 없다. 따라서 [data-og-typography="dense-scan"][data-og-density="compact"] 같은 속성 조건부 규칙과 cjk-doc 의 :lang() 분기는 작동하지 않는다. 그 사실을 경고로 반환한다.

      완전 적용이 필요하면 컨테이너 요소를 직접 넘겨라(document.querySelector('#myGrid')).

      Apply a preset. Requires no core modification.

      There are two paths and they are not equally capable — stated plainly.

      1. An HTMLElement target (the grid container, .og-container) gets the data-og-typography attribute, so every CSS rule works, including density compound selectors (optical sizing) and the :lang() Han-unification split. This is the full path.
      2. A grid instance target gets the nine tokens injected inline via the public setThemeVar(). OpenGrid exposes no public accessor for its container element (verified 2026-08: _container is private with no public getter), so the attribute cannot be set. Attribute-conditional rules therefore do not apply; this is returned as a warning.

      Parameters

      • target: HTMLElement | TypographyGridTarget

        그리드 컨테이너 요소 또는 그리드 인스턴스

        The grid container element, or a grid instance

      • id: string

        프리셋 id('default' 는 축 해제)

        Preset id ('default' clears the axis)

      Returns TypographyApplyResult

      적용 경로 + 정직 고지

      The path taken plus honest notices

      target 이 요소도 그리드도 아니면 Error

      Throws when the target is neither an element nor a grid

      import { applyTypography } from 'open-grid/typography';
      import 'open-grid/dist/open-grid-typography.css';

      applyTypography(document.querySelector('#grid .og-container')!, 'ledger'); // 완전 적용
      applyTypography(grid, 'ledger'); // 변수만 — 경고 1건 반환

    Settings

    Member Visibility