제6축(표의 머리 = 헤더의 형태)의 런타임 진입점이다. 코어(open-grid)와 별도 엔트리로 갈라 두었기
때문에, 이 모듈을 import 하지 않는 사용자에게는 단 1바이트도 배송되지 않는다.
왜 별도 플러그인인가: OpenGrid.ts 에 정적 import 를 한 줄이라도 넣으면 축 코드 전체가 코어
청크로 끌려 들어간다. 헤더 취향 기능 때문에 모든 사용자의 번들을 늘리지 않겠다는 결정이다
(타이포 축이 같은 이유로 같은 구조를 택했다 — src/typography/index.ts).
이 축은 CSS 없이는 거의 아무 일도 하지 않는다. 프리셋의 본체(셀렉터 규칙·색 유도·pill::before)는 open-grid/header.css 가 소유하고, 이 모듈은 그 CSS 를 켜는 스위치
(data-og-header 속성)와 형태 토큰 8개의 소유권만 갖는다. 그 사실을 숨기지 않고
applyHeader() 의 반환 경고로 알린다.
OPEN_GRID header-axis plugin — open-grid/header.
The runtime entry point for the 6th (header-form) axis. It is a separate build entry from the
core, so users who never import it are shipped exactly zero bytes of it.
This axis does almost nothing without its CSS. The presets themselves live in
open-grid/header.css; this module owns only the switch that turns them on (the
data-og-header attribute) and the ownership of the 8 shape tokens.
OPEN_GRID 헤더 축 플러그인 —
open-grid/header.제6축(표의 머리 = 헤더의 형태)의 런타임 진입점이다. 코어(
open-grid)와 별도 엔트리로 갈라 두었기 때문에, 이 모듈을 import 하지 않는 사용자에게는 단 1바이트도 배송되지 않는다.왜 별도 플러그인인가:
OpenGrid.ts에 정적 import 를 한 줄이라도 넣으면 축 코드 전체가 코어 청크로 끌려 들어간다. 헤더 취향 기능 때문에 모든 사용자의 번들을 늘리지 않겠다는 결정이다 (타이포 축이 같은 이유로 같은 구조를 택했다 —src/typography/index.ts).이 축은 CSS 없이는 거의 아무 일도 하지 않는다. 프리셋의 본체(셀렉터 규칙·색 유도·
pill::before)는open-grid/header.css가 소유하고, 이 모듈은 그 CSS 를 켜는 스위치 (data-og-header속성)와 형태 토큰 8개의 소유권만 갖는다. 그 사실을 숨기지 않고applyHeader()의 반환 경고로 알린다.OPEN_GRID header-axis plugin —
open-grid/header.The runtime entry point for the 6th (header-form) axis. It is a separate build entry from the core, so users who never import it are shipped exactly zero bytes of it.
This axis does almost nothing without its CSS. The presets themselves live in
open-grid/header.css; this module owns only the switch that turns them on (thedata-og-headerattribute) and the ownership of the 8 shape tokens.OPEN_GRID ヘッダー軸プラグイン —
open-grid/header。第6軸(表の頭 = ヘッダーの形状)のランタイムエントリーポイントです。コア(
open-grid)とは 別のエントリーに分けてあるため、このモジュールを import しない利用者には1バイトも配信されません。なぜ別プラグインなのか:
OpenGrid.tsに静的 import を一行でも入れると、軸のコード全体がコア チャンクへ引き込まれます。ヘッダーの好みの機能のために、すべての利用者のバンドルを増やさないと いう判断です(タイポグラフィ軸も同じ理由で同じ構造を選びました —src/typography/index.ts)。この軸は CSS なしではほとんど何もしません。 プリセットの本体(セレクター規則・色の導出・
pillの::before)はopen-grid/header.cssが所有し、このモジュールが持つのは、その CSS を 入れるスイッチ(data-og-header属性)と形状トークン8個の所有権だけです。その事実は 隠さず、applyHeader()が返す警告で知らせます。OPEN_GRID 表头轴插件 —
open-grid/header。第6轴(表的头部 = 表头形状)的运行时入口点。它与核心(
open-grid)拆成了各自独立的构建入口, 因此从不 import 这个模块的用户,一个字节也收不到。为什么做成独立插件: 只要在
OpenGrid.ts里写一行静态 import,整个轴的代码就会被拖进核心块。 不能为了一个表头偏好的功能,让所有用户的包变大(排版轴出于同样理由选了同样的结构 —src/typography/index.ts)。这个轴没有 CSS 就几乎什么都不做。 预设的主体(选择器规则、颜色推导、
pill的::before) 由open-grid/header.css所有,这个模块只拿到打开那些 CSS 的开关(data-og-header属性) 和8个形状令牌的所有权。这个事实不隐瞒,通过applyHeader()返回的警告告知。