@naeil/ui 0.7.1 → 0.7.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,9 +1,18 @@
1
1
  # Changelog
2
2
 
3
- ## 0.7.1 — account presentation correction (candidate)
3
+ ## 0.7.2 — retired project catalog (candidate)
4
+
5
+ - Narrow the canonical `NaeilHeader` project catalog to naeil-ui. Content Collector, PKM, Sustainability Analyzer and Baby Agent are retired from naeil.dev; their site pages move to `src/app/_archive/` and old URLs temporarily redirect to the project list. The project menu uses one column for a single entry. `projects`, `translations` and `currentProjectKey` overrides are unchanged.
6
+ - Release class `dom`: the standing worker adopts it only through an owner-approved `reviewedMigration` of this exact release; ordinary fix-only patches are unaffected.
7
+
8
+ ## 0.7.1 — canonical service chrome (published 2026-10-23)
9
+
10
+ Published to npm at `2026-10-23T01:14:11.387Z`; `latest` was verified as `0.7.1`. This first published 0.7.x release includes the unpublished 0.7.0 scope below. Frozen package source and tag `v0.7.1`: `32108fd8e1cb1db6dae24a09f3ca72ac9a91f618`; archive SHA-256: `ecd656c595fd63516417eef58a5e2624d1f1bf928ba0465761292d05502ab3f8`. Independent download and fresh React/Next registry consumers matched the archive and all 139 files, with types, production builds and browser checks passing. Hosted Docs and standing activation require separate receipts; see the [release policy](docs/package-release.md#publication-and-deployment).
4
11
 
5
12
  - Add canonical `NaeilHeaderAccountControl` for shared login/account/logout presentation while consumers retain session and save guards.
13
+ - Include React-only `NaeilFooter`, canonical full/compact destinations, save-navigation interception and server-safe `/release` package/contract identity from the unpublished 0.7.0 candidate.
6
14
  - Preserve existing header slots and imports; include authenticated menu/busy/failure coverage and packed consumer checks.
15
+ - Preserve the approved 1600px/clamp frame, generic Navigation/SiteFooter and legacy Nav/Footer APIs. Bundled guides retain their frozen preparation snapshot; maintained guides and hosted Docs use a separately reviewed source.
7
16
 
8
17
  ## 0.7.0 — unpublished candidate
9
18
 
package/README.md CHANGED
@@ -2,24 +2,26 @@
2
2
 
3
3
  React components, semantic design tokens, and shared styles for naeil products. The approved system uses a neutral light/dark palette, Pretendard, 16px controls, comfortable or compact density, purpose-specific content widths, and restrained motion. Radix supplies interaction behavior.
4
4
 
5
+ **0.7.1 published and registry-verified — 2026-10-23.** The current published baseline is **0.7.1**. This first published 0.7.x release combines canonical `NaeilFooter`, server-safe `/release` identity and `NaeilHeaderAccountControl`; 0.7.0 remains an unpublished candidate. The frozen package source and `v0.7.1` tag are `32108fd8e1cb1db6dae24a09f3ca72ac9a91f618`. Fresh React/Next registry consumers matched all 139 frozen files and passed types, production builds and browser checks. Maintained guides use separately reviewed source; hosted Docs and standing activation require separate receipts. See the [release policy and receipts](docs/package-release.md#publication-and-deployment).
6
+
5
7
  This repository also contains the **naeil.dev brand/example website** and an **optional agent reference workflow**. Choose the path you need:
6
8
 
7
9
  | Path | Start here | Tools / keys |
8
10
  | --- | --- | --- |
9
- | Use the UI in an app | [Consumer guide](docs/design/v2-migration.md) | React 19, Tailwind 4; **no Next.js or API keys** for `/ui` or `/naeil-header` |
11
+ | Use the UI in an app | [Consumer guide](docs/design/v2-migration.md) | React 19, Tailwind 4; **no Next.js or API keys** for shared React entries |
10
12
  | Develop the shared UI | Commands below and [contributing](https://github.com/naeil-dev/naeil-ui/blob/81fd395031dc5b20074c4d915a8585360ce2d28a/CONTRIBUTING.md) | Node.js 22+, pnpm; no Supabase or 21st key |
11
13
  | Use frontend references with an agent | [Optional workflow setup](https://github.com/naeil-dev/naeil-ui/blob/81fd395031dc5b20074c4d915a8585360ce2d28a/docs/design/frontend-tooling.md) | Supported agent; Python for bundled helpers; your own 21st key only for optional MCP |
12
14
  | Develop the brand/example website | [Site setup](https://github.com/naeil-dev/naeil-ui/blob/81fd395031dc5b20074c4d915a8585360ce2d28a/docs/site-development.md) | Next.js and a separate Supabase project for site authentication |
13
15
 
14
16
  ## Use the UI
15
17
 
16
- This guide targets **@naeil/ui 0.6.0** with React 19 / ReactDOM 19 and Tailwind 4. UI v2 names the design generation independently of npm versioning. Install the matching release in your app:
18
+ Use React 19 / ReactDOM 19 and Tailwind 4. UI v2 names the design generation independently of npm versioning. Install the verified registry release:
17
19
 
18
20
  ```sh
19
- pnpm add --save-exact @naeil/ui@0.6.0
21
+ pnpm add --save-exact @naeil/ui@0.7.1
20
22
  ```
21
23
 
22
- For a local candidate, run `pnpm build:pkg` and `npm pack --ignore-scripts --pack-destination /tmp`, then install `/tmp/naeil-ui-0.6.0.tgz`. The [release record](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.6.0) tracks archive identity, publication and deployment separately.
24
+ The [npm 0.7.1 archive](https://registry.npmjs.org/@naeil/ui/-/ui-0.7.1.tgz) is byte-identical to the frozen release archive. Its bundled guides retain the preparation snapshot; use these maintained instructions for current installation. For local development, `pnpm build:pkg` and `npm pack --ignore-scripts --pack-destination /tmp` produce `/tmp/naeil-ui-0.7.1.tgz`. A fresh pack of maintained source differs from the frozen release archive; use the exact frozen file for release verification. The [0.6.0 release record](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.6.0) retains its archive, publication and deployment evidence.
23
25
 
24
26
  The preceding [0.5.0 release](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.5.0) was published on 2026-10-15 and introduced the whole shared header. Version 0.6.0 adds the shared 1600px frame; existing applications must upgrade and adopt its layout composition.
25
27
 
@@ -30,11 +32,13 @@ Choose the shared application composition before building a header or footer:
30
32
  | Application need | Shared component |
31
33
  | --- | --- |
32
34
  | Actual naeil.dev brand, project catalog and controls | `NaeilHeader` from `@naeil/ui/naeil-header` |
35
+ | Owned-service login, account and logout presentation (0.7.1) | `NaeilHeaderAccountControl` from `@naeil/ui/naeil-header`, passed in `authSlot` |
36
+ | Owned naeil service footer (0.7.1) | `NaeilFooter` from `@naeil/ui/naeil-footer` |
33
37
  | A product's own menu | `Navigation` from `@naeil/ui/ui` |
34
- | Full or compact application footer | `SiteFooter` from `@naeil/ui/ui` |
38
+ | Different product footer or deliberate content override | `SiteFooter` from `@naeil/ui/ui` |
35
39
  | Existing Next/next-intl integration | Preserve `Nav` / `Footer` compatibility adapters |
36
40
 
37
- Supply application routing, guards, authentication and menu data through adapters and slots. Keep the shared menu, mobile sheet, controls and footer implementation in the package. The [application layout guide](docs/components/application-layout.md) provides a starter and consumer-agent instructions. Header, main and footer share a 1600px maximum frame with `clamp(16px, 2.4vw, 40px)` gutters; use `ui-app-frame` on main and keep 640px reading/settings or 480px short-form sections inside it.
41
+ Pair `NaeilHeader` and `NaeilFooter` in owned services. Supply application routing, guards, authentication and menu data through adapters and slots. `NaeilHeaderAccountControl` receives session state, a busy flag and the guarded logout callback; keep pending state and its request lock above the header so desktop/mobile copies share them. Keep the shared menu, mobile sheet, account presentation and footer implementation in the package. The [application layout guide](docs/components/application-layout.md) provides a starter and consumer-agent instructions. Header, main and footer share a 1600px maximum frame with `clamp(16px, 2.4vw, 40px)` gutters; use `ui-app-frame` on main and keep 640px reading/settings or 480px short-form sections inside it.
38
42
 
39
43
  Import primitives from the dedicated entrypoint:
40
44
 
@@ -73,9 +77,9 @@ Mark Japanese content with `lang="ja"`. Keep font OFL notices with redistributed
73
77
 
74
78
  Shared CSS follows the OS theme unless the document root has `class="light"` or `class="dark"`. For compact spacing, set `data-ui-density="compact"` on that root; omit it for comfortable spacing. Density changes spacing while retaining 16px control text and minimum mobile touch sizes. React apps can also use `ThemeProvider` from `@naeil/ui/components/theme-provider` with `attribute="class"`.
75
79
 
76
- The [component guides](docs/components/README.md) cover exact APIs, state composition and accessibility responsibilities. Each has a built Storybook Docs page and runnable Usage example. The [consumer guide](docs/design/v2-migration.md) covers peer dependencies, fonts, themes, density, Select versus DropdownMenu, overrides, and layout ownership. Fonts are delivered by the consumer; shared CSS does not fetch them automatically. `/ui`, `/utils` and the opt-in `/naeil-header` work without Next.js. The legacy root remains a framework compatibility entry with static Next/next-intl imports; install those optional peers when using it, Nav, Footer or i18n/routing. ThemeProvider/controls and Toaster retain the React library next-themes. Shared deep imports use the exact [allowlist and migration](docs/design/v2-migration.md#03-package-boundary); website-only paths belong in your application.
80
+ The [component guides](docs/components/README.md) cover exact APIs, state composition and accessibility responsibilities, with matching Storybook Docs and runnable examples. Canonical footer and account examples live in the existing NaeilHeader/SiteFooter stories. The [consumer guide](docs/design/v2-migration.md) covers peer dependencies, fonts, themes, density, Select versus DropdownMenu, overrides, and layout ownership. Fonts are delivered by the consumer; shared CSS does not fetch them automatically. `/ui`, `/utils`, `/naeil-header`, `/naeil-footer` and `/release` work without Next.js; the last two are included in 0.7.1. The legacy root remains a framework compatibility entry with static Next/next-intl imports; install those optional peers when using it, Nav, Footer or i18n/routing. ThemeProvider/controls and Toaster retain the React library next-themes. Shared deep imports use the exact [allowlist and migration](docs/design/v2-migration.md#03-package-boundary); website-only paths belong in your application.
77
81
 
78
- For the actual naeil.dev branded header, import `NaeilHeader` from `@naeil/ui/naeil-header`; generic `Navigation` from `/ui` remains available for different product menus. The whole header owns its catalog, header translations, controls and responsive styles. Supply routing/dirty guards, an existing next-themes provider and real authentication through its props instead of copying the header. Its five decorative project images reference official `naeil.dev` URLs and require network access; their bytes are excluded and unresolved redistribution provenance remains in [third-party notices](THIRD_PARTY_NOTICES.md). See [NaeilHeader](docs/components/naeil-header.md) for fixed positioning, the shared frame, supported locales and adapter contract.
82
+ For the actual naeil.dev branded header, import `NaeilHeader` and `NaeilHeaderAccountControl` from `@naeil/ui/naeil-header`; generic `Navigation` from `/ui` remains available for different product menus. The whole header owns its catalog, header translations, controls and responsive styles. Supply routing/dirty guards, an existing next-themes provider and real authentication state/actions through its props. Its five decorative project images reference official `naeil.dev` URLs and require network access; their bytes are excluded and unresolved redistribution provenance remains in [third-party notices](THIRD_PARTY_NOTICES.md). See [NaeilHeader](docs/components/naeil-header.md) for fixed positioning, the shared frame, supported locales and adapter contract, and [NaeilFooter](docs/components/naeil-footer.md) for canonical destinations and save interception.
79
83
 
80
84
  ## Develop the shared UI
81
85
 
@@ -92,7 +96,8 @@ Storybook uses the actual public components with simulated example data. It need
92
96
  ```sh
93
97
  pnpm build:pkg
94
98
  pnpm pack --pack-destination /tmp
95
- # In your consumer app: pnpm add /tmp/naeil-ui-0.6.0.tgz
99
+ # In your consumer app: pnpm add /tmp/naeil-ui-0.7.1.tgz
100
+ # This development pack does not replace the frozen release archive.
96
101
  ```
97
102
 
98
103
  | Command | Purpose |
@@ -104,7 +109,7 @@ pnpm pack --pack-destination /tmp
104
109
  | `pnpm build:pkg` / `pnpm check:package` | Build package / inspect package boundary and independently install/build packed React + Next consumers |
105
110
  | `pnpm dev` / `pnpm build` | Brand/example website development / build |
106
111
 
107
- A [reusable React consumer example](https://github.com/naeil-dev/naeil-ui/tree/main/examples/react) composes the packaged header, a settings form and footer. [Release policy](docs/package-release.md) and [changelog](CHANGELOG.md) distinguish implementation, publication and deployment. CI verifies the package and separate website/Storybook. Downloadable preview artifacts include notices and local fonts. The current local Storybook build contains 17 Docs pages (15 UI families and Brand / Logo plus NaeilHeader), including the whole-header Usage and JapaneseApplication examples. This does not establish a new hosted deployment. [Hosted Docs](https://naeil-dev.github.io/naeil-ui/) have recorded [0.5.0 verification](https://github.com/naeil-dev/naeil-ui/releases/download/v0.5.0/hosted-docs-verification.json). The current release record identifies the subsequent deployed source and its fresh checks. The same approved brand is live on [naeil.dev](https://naeil.dev/). See [preview instructions](docs/package-release.md#storybook-preview-artifact) and [support limits](docs/design/public-ui-support.md). Native/manual platform acceptance and adoption in a real consumer product remain open.
112
+ A [reusable React consumer example](https://github.com/naeil-dev/naeil-ui/tree/main/examples/react) composes the packaged header, a settings form and footer. [Release policy](docs/package-release.md) and [changelog](CHANGELOG.md) distinguish implementation, publication and deployment. CI verifies the package and separate website/Storybook. Downloadable preview artifacts include notices and local fonts. The current Storybook source defines 17 Docs pages (15 UI families and Brand / Logo plus NaeilHeader), including Usage, JapaneseApplication, ReferenceFull, ReferenceCompact and AccountStates examples. This does not establish a new hosted deployment. [Hosted Docs](https://naeil-dev.github.io/naeil-ui/) have recorded [0.5.0 verification](https://github.com/naeil-dev/naeil-ui/releases/download/v0.5.0/hosted-docs-verification.json); subsequent deployments require their own source and HTTP checks. The same approved brand is live on [naeil.dev](https://naeil.dev/). See [preview instructions](docs/package-release.md#storybook-preview-artifact) and [support limits](docs/design/public-ui-support.md). Native/manual platform acceptance retains its documented limits; service adoption and continuous rollout have separate [dated records](https://github.com/naeil-dev/naeil-ui/tree/main/docs/rollout).
108
113
 
109
114
  Read [DESIGN.md](DESIGN.md) before shared UI changes. Numeric values live in `src/tokens/`; generated CSS is not edited by hand. Shared styles live in `src/styles/`, site-only styles in `src/app/`. Hero art, 3D scenes, cursor effects, and site content belong to the example website.
110
115
 
@@ -1165,7 +1165,7 @@ function Logo(_a) {
1165
1165
  }
1166
1166
 
1167
1167
  // src/lib/ui-release.ts
1168
- var uiRelease = { version: "0.7.1", contractVersion: "1" };
1168
+ var uiRelease = { version: "0.7.2", contractVersion: "1" };
1169
1169
 
1170
1170
  export {
1171
1171
  Logo,
@@ -2,7 +2,7 @@
2
2
  import {
3
3
  Logo,
4
4
  uiRelease
5
- } from "./chunk-VWIUN35X.js";
5
+ } from "./chunk-7JBLPGZ4.js";
6
6
  import {
7
7
  Badge,
8
8
  Button,
@@ -35,40 +35,12 @@ import { Moon, Sun } from "lucide-react";
35
35
  var headerLocales = ["en", "ko", "ja"];
36
36
  var headerLocaleNames = { en: "English", ko: "\uD55C\uAD6D\uC5B4", ja: "\u65E5\u672C\u8A9E" };
37
37
  var headerProjects = [
38
- {
39
- "key": "cc",
40
- "href": "/cc",
41
- "accent": "oklch(0.704 0.140 181)",
42
- "icon": "coral",
43
- "status": "active"
44
- },
45
- {
46
- "key": "pkm",
47
- "href": "/pkm",
48
- "accent": "oklch(0.702 0.183 293)",
49
- "icon": "jellyfish",
50
- "status": "coming"
51
- },
52
38
  {
53
39
  "key": "naeilUi",
54
40
  "href": "/design",
55
41
  "accent": "oklch(0.623 0.214 259)",
56
42
  "icon": "whale",
57
43
  "status": "active"
58
- },
59
- {
60
- "key": "sa",
61
- "href": "/sa",
62
- "accent": "oklch(0.723 0.219 149)",
63
- "icon": "fish",
64
- "status": "active"
65
- },
66
- {
67
- "key": "babyAgent",
68
- "href": "/baby-agent",
69
- "accent": "oklch(0.769 0.188 70.08)",
70
- "icon": "turtle",
71
- "status": "coming"
72
44
  }
73
45
  ];
74
46
  var headerContent = {
@@ -391,7 +363,7 @@ function NaeilHeader(_a) {
391
363
  })
392
364
  ),
393
365
  items: [
394
- ...showProjects ? [{ id: "projects", label: (_b2 = translations == null ? void 0 : translations.projects) != null ? _b2 : content.nav.projects, items: projectLinks, columns: 2 }] : [],
366
+ ...showProjects ? [{ id: "projects", label: (_b2 = translations == null ? void 0 : translations.projects) != null ? _b2 : content.nav.projects, items: projectLinks, columns: projectLinks.length > 1 ? 2 : 1 }] : [],
395
367
  ...showBlog ? [{ id: "blog", label: (_c = translations == null ? void 0 : translations.blog) != null ? _c : content.nav.blog, href: resolveHref("/blog"), external: projectsExternal }] : [],
396
368
  ...(subNav != null ? subNav : []).map((item) => __spreadProps(__spreadValues({}, item), { id: item.href }))
397
369
  ],
@@ -2,10 +2,10 @@
2
2
  import {
3
3
  NaeilHeader,
4
4
  headerLocales
5
- } from "../chunk-OLKTEYLS.js";
5
+ } from "../chunk-MGCCKOGU.js";
6
6
  import {
7
7
  Logo
8
- } from "../chunk-VWIUN35X.js";
8
+ } from "../chunk-7JBLPGZ4.js";
9
9
  import {
10
10
  SiteFooter
11
11
  } from "../chunk-HSTDPY56.js";
@@ -3,7 +3,7 @@
3
3
  import {
4
4
  Logo,
5
5
  uiRelease
6
- } from "../chunk-VWIUN35X.js";
6
+ } from "../chunk-7JBLPGZ4.js";
7
7
  import {
8
8
  SiteFooter
9
9
  } from "../chunk-HSTDPY56.js";
@@ -5,8 +5,8 @@ import {
5
5
  NaeilHeaderAccountControl,
6
6
  NaeilHeaderLocaleControl,
7
7
  NaeilHeaderThemeControl
8
- } from "../chunk-OLKTEYLS.js";
9
- import "../chunk-VWIUN35X.js";
8
+ } from "../chunk-MGCCKOGU.js";
9
+ import "../chunk-7JBLPGZ4.js";
10
10
  import "../chunk-QQQQZEPV.js";
11
11
  import "../chunk-JBTDRVZ7.js";
12
12
  export {
@@ -1 +1 @@
1
- export declare const uiRelease: Readonly<{version: "0.7.1"; contractVersion: "1"}>;
1
+ export declare const uiRelease: Readonly<{version: "0.7.2"; contractVersion: "1"}>;
@@ -1 +1 @@
1
- export const uiRelease = Object.freeze({"version":"0.7.1","contractVersion":"1"});
1
+ export const uiRelease = Object.freeze({"version":"0.7.2","contractVersion":"1"});
@@ -6,35 +6,11 @@ declare const headerLocaleNames: {
6
6
  readonly ja: "日本語";
7
7
  };
8
8
  declare const headerProjects: readonly [{
9
- readonly key: "cc";
10
- readonly href: "/cc";
11
- readonly accent: "oklch(0.704 0.140 181)";
12
- readonly icon: "coral";
13
- readonly status: "active";
14
- }, {
15
- readonly key: "pkm";
16
- readonly href: "/pkm";
17
- readonly accent: "oklch(0.702 0.183 293)";
18
- readonly icon: "jellyfish";
19
- readonly status: "coming";
20
- }, {
21
9
  readonly key: "naeilUi";
22
10
  readonly href: "/design";
23
11
  readonly accent: "oklch(0.623 0.214 259)";
24
12
  readonly icon: "whale";
25
- readonly status: "active";
26
- }, {
27
- readonly key: "sa";
28
- readonly href: "/sa";
29
- readonly accent: "oklch(0.723 0.219 149)";
30
- readonly icon: "fish";
31
- readonly status: "active";
32
- }, {
33
- readonly key: "babyAgent";
34
- readonly href: "/baby-agent";
35
- readonly accent: "oklch(0.769 0.188 70.08)";
36
- readonly icon: "turtle";
37
- readonly status: "coming";
13
+ readonly status: "active" | "coming";
38
14
  }];
39
15
  declare const headerContent: {
40
16
  readonly en: {
@@ -1,40 +1,12 @@
1
1
  const headerLocales = ["en", "ko", "ja"];
2
2
  const headerLocaleNames = { en: "English", ko: "\uD55C\uAD6D\uC5B4", ja: "\u65E5\u672C\u8A9E" };
3
3
  const headerProjects = [
4
- {
5
- "key": "cc",
6
- "href": "/cc",
7
- "accent": "oklch(0.704 0.140 181)",
8
- "icon": "coral",
9
- "status": "active"
10
- },
11
- {
12
- "key": "pkm",
13
- "href": "/pkm",
14
- "accent": "oklch(0.702 0.183 293)",
15
- "icon": "jellyfish",
16
- "status": "coming"
17
- },
18
4
  {
19
5
  "key": "naeilUi",
20
6
  "href": "/design",
21
7
  "accent": "oklch(0.623 0.214 259)",
22
8
  "icon": "whale",
23
9
  "status": "active"
24
- },
25
- {
26
- "key": "sa",
27
- "href": "/sa",
28
- "accent": "oklch(0.723 0.219 149)",
29
- "icon": "fish",
30
- "status": "active"
31
- },
32
- {
33
- "key": "babyAgent",
34
- "href": "/baby-agent",
35
- "accent": "oklch(0.769 0.188 70.08)",
36
- "icon": "turtle",
37
- "status": "coming"
38
10
  }
39
11
  ];
40
12
  const headerContent = {
@@ -181,7 +181,7 @@ function NaeilHeader(_a) {
181
181
  })
182
182
  ),
183
183
  items: [
184
- ...showProjects ? [{ id: "projects", label: (_b2 = translations == null ? void 0 : translations.projects) != null ? _b2 : content.nav.projects, items: projectLinks, columns: 2 }] : [],
184
+ ...showProjects ? [{ id: "projects", label: (_b2 = translations == null ? void 0 : translations.projects) != null ? _b2 : content.nav.projects, items: projectLinks, columns: projectLinks.length > 1 ? 2 : 1 }] : [],
185
185
  ...showBlog ? [{ id: "blog", label: (_c = translations == null ? void 0 : translations.blog) != null ? _c : content.nav.blog, href: resolveHref("/blog"), external: projectsExternal }] : [],
186
186
  ...(subNav != null ? subNav : []).map((item) => __spreadProps(__spreadValues({}, item), { id: item.href }))
187
187
  ],
@@ -1,5 +1,5 @@
1
1
  declare const uiRelease: {
2
- readonly version: "0.7.1";
2
+ readonly version: "0.7.2";
3
3
  readonly contractVersion: "1";
4
4
  };
5
5
 
@@ -1,4 +1,4 @@
1
- const uiRelease = { version: "0.7.1", contractVersion: "1" };
1
+ const uiRelease = { version: "0.7.2", contractVersion: "1" };
2
2
  export {
3
3
  uiRelease
4
4
  };
@@ -1,6 +1,6 @@
1
1
  # Component usage guides
2
2
 
3
- These guides include the unpublished **@naeil/ui 0.7.0 candidate**; the last published release is 0.6.0. release identities and publication evidence are recorded in the [release record](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.6.0). [Setup, themes, fonts and shared responsibilities](common.md). Run `pnpm storybook` for the current 17 Docs pages (15 UI and 2 Brand) and choose Docs or Usage. The [hosted Storybook](https://naeil-dev.github.io/naeil-ui/) was last verified for [0.5.0 on 2026-10-15](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.5.0); each subsequent deployment is recorded separately. Select chooses a value; DropdownMenu chooses an action.
3
+ These maintained guides cover **published and registry-verified @naeil/ui 0.7.1**: canonical footer and release identity from the unpublished 0.7.0 candidate, plus shared account presentation. The current published baseline is 0.7.1; see [release policy and identities](../package-release.md#publication-and-deployment). [Setup, themes, fonts and shared responsibilities](common.md). Run `pnpm storybook` for the current 17 Docs pages (15 UI and 2 Brand) and choose Docs or Usage. The [hosted Storybook](https://naeil-dev.github.io/naeil-ui/) has recorded [0.5.0 verification](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.5.0); each subsequent deployment requires its own receipt. Select chooses a value; DropdownMenu chooses an action.
4
4
 
5
5
  Start application layouts with the [shared navigation/footer selection and frame guide](application-layout.md). It includes a starter, the 1600px frame contract and instructions to place in consumer repositories so agents reuse the shared implementation.
6
6
 
@@ -22,8 +22,8 @@ Start application layouts with the [shared navigation/footer selection and frame
22
22
  | Navigation | [Navigation](./navigation.md) | UI / Navigation / Usage |
23
23
  | SiteFooter | [SiteFooter](./navigation.md) | UI / SiteFooter / Usage |
24
24
  | NaeilFooter | [NaeilFooter](./naeil-footer.md) | Brand / NaeilHeader / ReferenceFull, ReferenceCompact |
25
- | NaeilHeader | [NaeilHeader](./naeil-header.md) | Brand / NaeilHeader / Usage, JapaneseApplication |
25
+ | NaeilHeader and account control | [NaeilHeader](./naeil-header.md) | Brand / NaeilHeader / Usage, JapaneseApplication, AccountStates |
26
26
 
27
27
  [Field, native radio, Select and action composition](./composition.md) explains consumer state and semantic choices. [Demand decision](../design/component-demand.md) records why these two families were added.
28
28
 
29
- Use opt-in `@naeil/ui/naeil-header` for the actual naeil.dev branded header, with official artwork URL references and consumer-owned routing, theme provider and authentication. Use generic `Navigation` from `/ui` for different product menus. [Navigation / SiteFooter](navigation.md) also documents the compatibility adapters.
29
+ Use opt-in `@naeil/ui/naeil-header` for the actual naeil.dev branded header and its `NaeilHeaderAccountControl` in `authSlot`, paired with `@naeil/ui/naeil-footer` on owned services. Consumers supply routing/save guards, theme providers and authentication state/actions; official artwork remains URL-referenced. Canonical footer and account examples are part of existing stories, without additional Docs families. Use generic `Navigation` and `SiteFooter` from `/ui` for different products. [Navigation / SiteFooter](navigation.md) also documents the compatibility adapters.
@@ -1,18 +1,19 @@
1
1
  # Application frame and shared navigation/footer
2
2
 
3
- This guide targets the **@naeil/ui 0.7.0 candidate**, including the width update approved on 2026-10-16. Use the matching registry release or tested local archive. See [consumer setup](../design/v2-migration.md) for CSS, Tailwind sources and fonts.
3
+ This maintained guide covers **published and registry-verified @naeil/ui 0.7.1**, combining canonical footer/release identity and shared account presentation with the published 0.6.0 frame. Install exact `@naeil/ui@0.7.1` from npm; hosted Docs and service activation have separate receipts. See [release identities and status](../package-release.md#publication-and-deployment) and [consumer setup](../design/v2-migration.md) for CSS, Tailwind sources and fonts.
4
4
 
5
5
  ## Choose the shared composition first
6
6
 
7
7
  | Application need | Use |
8
8
  | --- | --- |
9
9
  | The actual naeil.dev brand, project catalog and controls | `NaeilHeader` from `@naeil/ui/naeil-header` |
10
+ | Owned-service login/account/logout presentation | `NaeilHeaderAccountControl` from `@naeil/ui/naeil-header` in `authSlot` |
10
11
  | A product's own menu | `Navigation` from `@naeil/ui/ui` |
11
12
  | Owned naeil service footer | `NaeilFooter` from `@naeil/ui/naeil-footer` |
12
13
  | Different product footer or explicit content override | `SiteFooter` from `@naeil/ui/ui` |
13
14
  | An existing Next/next-intl consumer | Keep its `Nav` / `Footer` adapters |
14
15
 
15
- Choose one header per application frame. Supply menu data, links, route guards, authentication and supported locale state through props/slots. Local adapters are appropriate; copies of the menu, responsive sheet, controls or footer implementation are not. Extend the shared component when a reusable behavior is missing.
16
+ Choose one header per application frame. Supply menu data, links, route guards, authentication and supported locale state through props/slots. Owned services pass session state and guarded callbacks to the shared account control. Local adapters are appropriate; copies of the menu, responsive sheet, account presentation or footer implementation are not. Extend the shared component when a reusable behavior is missing.
16
17
 
17
18
  ## Width contract
18
19
 
@@ -39,28 +40,43 @@ This keeps a centered frame from shifting when a classic scrollbar appears. The
39
40
 
40
41
  ```tsx
41
42
  import type { ReactNode } from "react";
42
- import { NaeilHeader } from "@naeil/ui/naeil-header";
43
+ import { NaeilHeader, NaeilHeaderAccountControl,
44
+ type NaeilHeaderAccount, type NaeilHeaderProps } from "@naeil/ui/naeil-header";
43
45
  import { NaeilFooter } from "@naeil/ui/naeil-footer";
44
46
 
45
47
  // Render inside the existing next-themes ThemeProvider.
46
- // Connect Link/onNavigate, locale and authSlot to real application state.
47
- export function ApplicationLayout({ children }: { children: ReactNode }) {
48
+ // The app owns session state, its guarded logout and pending request lock.
49
+ type ApplicationLayoutProps = {
50
+ children: ReactNode;
51
+ locale: NaeilHeaderProps["locale"];
52
+ Link: NaeilHeaderProps["Link"];
53
+ currentHref: string;
54
+ account: NaeilHeaderAccount;
55
+ };
56
+
57
+ export function ApplicationLayout({ children, locale, Link, currentHref,
58
+ account }: ApplicationLayoutProps) {
48
59
  return <>
49
- <NaeilHeader locale="en" />
60
+ <NaeilHeader locale={locale} Link={Link} currentHref={currentHref}
61
+ authSlot={<NaeilHeaderAccountControl locale={locale} Link={Link}
62
+ account={account} />} />
50
63
  <main className="ui-app-frame"
51
64
  style={{ marginTop: "calc(var(--ui-navigation-height) + 1px)" }}>
52
65
  {children}
53
66
  </main>
54
- <NaeilFooter locale="en" variant="compact" />
67
+ <NaeilFooter locale={locale} variant="compact" Link={Link} />
55
68
  </>;
56
69
  }
57
70
 
58
- <ApplicationLayout>
71
+ <ApplicationLayout locale="en" Link={GuardedLink} currentHref={pathname}
72
+ account={account}>
59
73
  <section data-ui-layout="settings">{/* Settings form */}</section>
60
74
  </ApplicationLayout>
61
75
  ```
62
76
 
63
- `NaeilHeader` is fixed; reserve its 65px height and account for it in sticky areas and focus/anchor scroll margins. Default destinations are official naeil.dev URLs. Preserve routing/unsaved-change guards using the [header contract](naeil-header.md). Only pass `onLocaleChange` when the application supports its complete language set.
77
+ `GuardedLink`, `pathname` and `account` come from the consumer. Use `{ status: 'signed-out', loginHref }` or `{ status: 'signed-in', onLogout, busy, displayName, email }` for `account`; the app handles async cancellation, failure and retry. Keep pending state and the request lock above `NaeilHeader`, since desktop/mobile slot contents mount separately. See the [account contract](naeil-header.md#account-presentation).
78
+
79
+ `NaeilHeader` is fixed; reserve its 65px height and account for it in sticky areas and focus/anchor scroll margins. Default destinations are official naeil.dev URLs. Preserve routing/unsaved-change guards using the [header contract](naeil-header.md) and [footer interception contract](naeil-footer.md); a Link adapter must handle absolute official and GitHub destinations as well as local routes. Only pass `onLocaleChange` when the application supports its complete language set.
64
80
 
65
81
  For a different product menu, use the [generic Navigation composition](navigation.md) with the same main/footer structure. Generic Navigation is in document flow by default and needs no fixed-header clearance. The [standalone React example](https://github.com/naeil-dev/naeil-ui/tree/main/examples/react) exercises the installed header, narrow form and SiteFooter together.
66
82
 
@@ -88,16 +104,32 @@ Put this in the **consumer application's** `AGENTS.md` (or equivalent repository
88
104
  ## Shared application layout
89
105
  - Read the installed @naeil/ui/DESIGN.md and docs/components/application-layout.md before UI layout work.
90
106
  - Use @naeil/ui/naeil-header for the canonical naeil header; use Navigation from @naeil/ui/ui for a different product menu. Use NaeilFooter from @naeil/ui/naeil-footer for owned service footers; SiteFooter remains the generic primitive. Keep existing Next Nav/Footer compatibility adapters when applicable.
107
+ - Put NaeilHeaderAccountControl from @naeil/ui/naeil-header in authSlot for owned apps. Supply real session state, the busy flag and guarded logout callback. Keep pending state and the request lock above the header so desktop/mobile copies share them; do not copy account/avatar/menu markup.
91
108
  - Local wrappers supply menu data, routing/guards, locale, auth and slots. Do not copy the menu, mobile sheet, controls or footer implementation. Extend the shared component for reusable missing behavior.
92
109
  - Use ui-app-frame on main; navigation/footer own their internal frames. Keep reading/settings/short-form sections inside that frame. Apply frame overrides consistently across routes.
93
110
  - Check the installed package version and CSS before creating a replacement for an apparently missing component.
94
- - Verify actual shared navigation/footer rendering and stable anchors across routes, themes and supported sizes. An import alone is not adoption evidence. Record intentional route exceptions.
111
+ - Verify actual shared navigation/footer rendering and stable anchors across routes, themes and supported sizes, including signed-out, signed-in, menu, busy, cancellation/failure and retry states. An import or anonymous-only check is not adoption evidence. Record intentional route exceptions.
95
112
  ```
96
113
 
97
114
  ## Adoption checks
98
115
 
99
116
  For each consumer, record its installed version, layout adapter, shared imports, CSS entrypoints and intentional exceptions. In that consumer's browser CI, check that expected application routes render `[data-slot="navigation"]` and `[data-slot="site-footer"]`, and that anchors remain stable between wide lists and narrow forms. Include narrow/zoomed screens, localized labels and tall content that introduces a scrollbar. Keep table overflow local.
100
117
 
118
+ Owned-service checks also verify canonical header/footer destinations, rendered package/contract identity and shared account states. Inspect both signed-in and signed-out chrome, open the account menu, and exercise busy, cancel/failure and retry without duplicate requests when the mobile sheet is reopened or the viewport changes.
119
+
101
120
  A blanket ban on `<header>`, `<nav>` or `<footer>` would also reject valid section landmarks and adapters. Review the root composition and its rendered output instead. This repository checks packed React/Next examples; external applications still need their own upgrades, adapter migrations and CI. Publication and deployment are separate work.
102
121
 
103
- See [canonical footer content and save interception](naeil-footer.md). 0.7.0 candidate adds package/contract identity; publication and per-service operational rollout are separate.
122
+ See [canonical footer content and save interception](naeil-footer.md). Version 0.7.1 includes package/contract identity from the unpublished 0.7.0 candidate; registry publication, hosted Docs and per-service operational rollout have separate receipts.
123
+
124
+ ## Shared naeil.dev login (services on `*.naeil.dev`)
125
+
126
+ Live since 2026-10-22 for naeil.dev, abestimate.naeil.dev and jev.naeil.dev. A new service joins the same login instead of running its own session, relay or password. Home Console (`:2455` on the tailnet) is outside the cookie scope.
127
+
128
+ - **Session:** read the default `@supabase/ssr` 0.9.0 cookie `sb-dathsxdsaxooifnxjket-auth-token` (and its `.0`, `.1` chunks) with `Domain=.naeil.dev; Path=/; Secure; SameSite=Lax`. Write refreshed chunks with the same options; never set a host-only copy.
129
+ - **Identity and access:** on the server call `supabase.auth.getUser()`, then `rpc('access_decision', { p_service_id: '<service>' })` with that session's access token. `allowed` → continue; `not_granted` / `member_inactive` / `service_inactive` → 403 page; terminal session errors → treat as signed out; other failures → 503.
130
+ - **Signed out:** redirect (307) to `https://naeil.dev/login?next=<absolute URL>`. Add the service origin to the site's `canonicalRedirect` allowlist (`src/lib/auth/redirect.ts`).
131
+ - **Logout:** `signOut({ scope: 'local' })`, then expire every shared cookie chunk with the same Domain/Path. All services see the user as signed out on the next request.
132
+ - **Header:** `NaeilHeaderAccountControl` in `authSlot`, linked to the login URL and the logout callback.
133
+ - **Onboarding:** register the service id in the central catalog, mark it verified, and grant users from Home Console (`console_set_access`).
134
+
135
+ Reference code: Estimate `src/server/naeil-shared-session.ts`; site `src/lib/auth/site-session.ts` and `cookie-domain.ts`. Commit `c076391` handles a stale pre-2026-10-17 host-only apex cookie that otherwise breaks the OAuth callback.
@@ -1,13 +1,13 @@
1
1
  # NaeilFooter — canonical service footer
2
2
 
3
- New in the **0.7.0 candidate** (not published). React-only opt-in entry:
3
+ Included in **published and registry-verified 0.7.1**, from the unpublished 0.7.0 candidate. Install exact `@naeil/ui@0.7.1` from npm; hosted Docs and service activation have separate receipts. See [release identities and publication status](../package-release.md#publication-and-deployment). React-only opt-in entry:
4
4
 
5
5
  ```tsx
6
6
  import { NaeilFooter } from '@naeil/ui/naeil-footer';
7
7
  <NaeilFooter locale="ja" variant="compact" Link={GuardedLink} />
8
8
  ```
9
9
 
10
- Use with [NaeilHeader](naeil-header.md) on owned user-facing services. Both `full` and `compact` contain the .naeil home link, Projects, Blog and the official naeil GitHub link. Full also displays the existing tagline. Compact reduces spacing/description, not the destinations. No social account or legal claim is invented. The website's former generic X homepage icon is not a canonical account link.
10
+ Use with [NaeilHeader and its account control](naeil-header.md) on owned user-facing services. Both `full` and `compact` contain the .naeil home link, Projects, Blog and the official naeil GitHub link. Full also displays the existing tagline. Compact reduces spacing/description, not the destinations. No social account or legal claim is invented. The website's former generic X homepage icon is not a canonical account link.
11
11
 
12
12
  `locale` selects `en`, `ko`, or `ja`. `resolveHref(path)` defaults to official localized naeil.dev destinations; a local website router may resolve unlocalized paths itself. `Link` handles **every** canonical anchor, including absolute GitHub URLs. It must forward href, target, rel, onClick, className and children. GitHub opens a new tab with noopener/noreferrer. The shared implementation does not itself trigger navigation or await saves.
13
13
 
@@ -1,6 +1,6 @@
1
1
  # NaeilHeader — branded whole-header composition
2
2
 
3
- This guide includes the **@naeil/ui 0.7.1 candidate**, whose unchanged frame comes from published 0.6.0. See the [release record](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.6.0) for archive and publication evidence. Import this opt-in React-only entry when an application inherits the actual naeil.dev header. Generic `Navigation` from `/ui` remains available for different product menus.
3
+ This maintained guide covers **published and registry-verified @naeil/ui 0.7.1**, adding shared account presentation to the unchanged 0.6.0 frame. Install exact `@naeil/ui@0.7.1` from npm; hosted Docs and service activation have separate receipts. See [release identities and publication status](../package-release.md#publication-and-deployment). Import this opt-in React-only entry when an application inherits the actual naeil.dev header. Generic `Navigation` from `/ui` remains available for different product menus.
4
4
 
5
5
  ```tsx
6
6
  import { NaeilHeader, NaeilHeaderAccountControl } from '@naeil/ui/naeil-header';
@@ -22,7 +22,7 @@ The module owns the brand, five-project catalog and header-only translations, pr
22
22
 
23
23
  Consumers provide an existing next-themes provider, routing/dirty-save guard, current locale and real authentication behavior. Default destinations point to `https://naeil.dev/{locale}`; the site's localized Link instead uses `resolveHref={path => path}`. A supplied `Link` handles default official destinations, including cross-origin URLs. `onNavigate` can intercept brand and menu links; honor modified clicks and target behavior. Explicit `external: true` project overrides and `projectsExternal` use native anchors, so intercept them with `onNavigate` when a dirty guard is required.
24
24
 
25
- Only provide `onLocaleChange` when the application's interface supports all three canonical locales (`en`, `ko`, `ja`). Omitting it removes the locale control; the component does not create application translations or shared preferences. `authSlot` uses `NaeilHeaderAccountControl` in owned applications: a shared44px neutral account trigger and localized Radix logout menu. Consumers supply their real session state/callbacks, not alternative account markup. The legacy slot remains public for deliberate compatibility overrides. It does not integrate site SSO, share credentials or create accounts. Theme preferences remain consumer-origin state. Without a working provider, rendering alone does not establish theme switching.
25
+ Only provide `onLocaleChange` when the application's interface supports all three canonical locales (`en`, `ko`, `ja`). Omitting it removes the locale control; the component does not create application translations or shared preferences. `authSlot` uses `NaeilHeaderAccountControl` in owned applications: a shared 44px neutral account trigger and localized Radix logout menu. Consumers supply their real session state/callbacks, not alternative account markup. The legacy slot remains public for deliberate compatibility overrides. It does not integrate site SSO, share credentials or create accounts. Theme preferences remain consumer-origin state. Without a working provider, rendering alone does not establish theme switching.
26
26
 
27
27
  | Prop | Contract |
28
28
  | --- | --- |
@@ -51,16 +51,18 @@ Standard header attributes and the remaining inherited [Navigation props](naviga
51
51
 
52
52
  Keep errors visible in the consumer's recovery UI or toast. The package never calls an authentication endpoint. Compare signed-in and signed-out render states separately; anonymous-only acceptance cannot establish authenticated parity. `AccountStates` is a synthetic Storybook example for pending/cancel/error/retry.
53
53
 
54
+ Own pending state and the in-flight request lock above `NaeilHeader`. Navigation mounts desktop and mobile slot contents separately, and closing the mobile sheet unmounts its copy. Pass the same controller to both through `authSlot`; test reopening the sheet and changing viewport during a pending request. State inside an independently mounted slot component can enable duplicate requests.
55
+
54
56
  ## Frame and content clearance
55
57
 
56
58
  The fixed header is 65px: the current 64px navigation token plus a 1px border. Clear it in the application's main, sticky regions and focus/anchor scroll margins with `calc(var(--ui-navigation-height) + 1px)`. The header, main and footer now share a 1600px maximum outer frame, including responsive `clamp(16px, 2.4vw, 40px)` gutters. Put `ui-app-frame` on main and reading/settings or short-form sections inside it; the header and shared footer apply their own internal frame. Do not wrap them in another padded frame. Apply deliberate `--ui-width-frame` / `--ui-frame-gutter` overrides on a common ancestor. Remove old `max-w-7xl` or `px-6` overrides to adopt the new defaults. This width update supersedes the previous 1280px/24px branded frame. See the [application layout starter](application-layout.md).
57
59
 
58
60
  ## Artwork and package boundary
59
61
 
60
- The five decorative images reference `https://naeil.dev/images/{coral,jellyfish,whale,fish,turtle}.png`. Rendering those images requires network access to the official origin. Their bytes are not redistributed in npm; [third-party notices](../../THIRD_PARTY_NOTICES.md) retain unresolved artwork provenance and redistribution limits. Brand marks are not relicensed by the repository MIT license. Captions and links remain usable when images fail.
62
+ The next release narrows the default catalog to naeil-ui and its `whale.png` image; 0.7.1 retains the five-project catalog described here. The five decorative images reference `https://naeil.dev/images/{coral,jellyfish,whale,fish,turtle}.png`. Rendering those images requires network access to the official origin. Their bytes are not redistributed in npm; [third-party notices](../../THIRD_PARTY_NOTICES.md) retain unresolved artwork provenance and redistribution limits. Brand marks are not relicensed by the repository MIT license. Captions and links remain usable when images fail.
61
63
 
62
- This entry requires no Next.js, next-intl, site session/auth backend, full application message catalog, hero or site public folder. Generic `/ui` imports do not import its catalog. The local Storybook provides **Brand / NaeilHeader / Docs, Usage, JapaneseApplication**; the Japanese example omits unsupported locale switching and uses a consumer-owned auth slot. Candidate examples do not establish hosted deployment.
64
+ This entry requires no Next.js, next-intl, site session/auth backend, full application message catalog, hero or site public folder. Generic `/ui` imports do not import its catalog. Storybook provides **Brand / NaeilHeader / Docs, Usage, JapaneseApplication, AccountStates, ReferenceFull, ReferenceCompact**; the Japanese example omits unsupported locale switching and supplies application state to the shared account control. Local examples do not establish hosted deployment.
63
65
 
64
66
  Verify actual packed consumption, Storybook behavior and rendered comparisons at matching viewport/language/theme. Source imports alone do not prove visual parity. Native Safari, devices, assistive technology, full OAuth and unresolved accessibility observations retain the [documented support limits](../design/public-ui-support.md).
65
67
 
66
- Pair owned-service headers with [NaeilFooter](naeil-footer.md). The 0.7.1 candidate emits package/contract identifiers for actual rendered validation.
68
+ Pair owned-service headers with [NaeilFooter](naeil-footer.md). Version 0.7.1 emits package/contract identifiers for actual rendered validation. The immutable `v0.7.1` package source is `32108fd8e1cb1db6dae24a09f3ca72ac9a91f618`; maintained pending-state guidance above and hosted Docs are reviewed separately from that frozen snapshot.
@@ -2,21 +2,21 @@
2
2
 
3
3
  이 안내는 `@naeil/ui`의 기본 모양과 재사용 규칙을 설명한다. 패키지 소비와 소비 사이트 배포는 별도 작업이다.
4
4
 
5
- 이 안내는 **@naeil/ui 0.6.0**의 CSS·API·패키지 경계를 대상으로 한다. UI v2는 디자인 세대 이름이며 npm 2.0을 뜻하지 않는다. 소스·archive와 실제 게시·배포 결과는 [릴리스 기록](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.6.0)에서 구분한다. 이전 0.5.0은 2026-10-15에 게시되었으며, 이번 버전에서 공통 1600px 프레임과 적용 규칙을 추가한다.
5
+ **0.7.1 npm 게시·registry 검증 완료 — 2026-10-23.** 현재 게시된 기준 버전은 **0.7.1**이다. 이 유지보수 안내는 canonical `NaeilFooter`, `NaeilHeaderAccountControl`, `/release` 식별자와 기존 1600px 프레임을 함께 다룬다. 0.7.0은 미게시 후보이며, 처음 게시된 0.7.x 버전은 0.7.1이다. 독립된 새 React/Next registry 설치에서 동결 파일 139개와 타입·프로덕션 빌드·브라우저 검증이 통과했다. hosted Docs와 상시 배포 활성화는 별도 실행 기록으로 확인한다. UI v2는 디자인 세대 이름이며 npm 2.0을 뜻하지 않는다. 동결 패키지 소스·archive, 별도 검토한 Docs 소스와 실제 게시·배포 결과는 [릴리스 정책](../package-release.md#publication-and-deployment)에서 구분한다.
6
6
 
7
7
  ## 시작하기
8
8
 
9
- React 19/ReactDOM 19와 Tailwind 4 앱에서 `/ui` 또는 선택적 `/naeil-header`를 사용한다. API 키와 Next.js는 필요 없다.
9
+ React 19/ReactDOM 19와 Tailwind 4 앱에서 `/ui` 또는 선택적 `/naeil-header`·`/naeil-footer`를 사용한다. API 키와 Next.js는 필요 없다. 검증한 registry 버전을 고정해 설치한다.
10
10
 
11
11
  ```sh
12
- pnpm add --save-exact @naeil/ui@0.6.0
12
+ pnpm add --save-exact @naeil/ui@0.7.1
13
13
  ```
14
14
 
15
- 로컬 후보를 검증할 때는 저장소에서 `pnpm build:pkg`와 `npm pack --ignore-scripts --pack-destination /tmp`를 실행하고 `/tmp/naeil-ui-0.6.0.tgz`를 설치한다. [독립 React 예제](https://github.com/naeil-dev/naeil-ui/tree/main/examples/react)와 [검증/릴리스 정책](../package-release.md)을 참고한다.
15
+ registry의 0.7.1 archive는 동결 릴리스 archive와 바이트가 일치한다. archive에 포함된 안내는 준비 시점의 기록이므로 현재 설치에는 이 유지보수 안내를 따른다. 로컬 개발에서는 저장소에서 `pnpm build:pkg`와 `npm pack --ignore-scripts --pack-destination /tmp`를 실행하고 `/tmp/naeil-ui-0.7.1.tgz`를 설치한다. 현재 소스의 개발용 pack은 동결 릴리스 archive와 다르므로 게시 파일을 대체하지 않는다. [독립 React 예제](https://github.com/naeil-dev/naeil-ui/tree/main/examples/react)와 [검증/릴리스 정책](../package-release.md)을 참고한다.
16
16
 
17
17
  공통 UI 소비에는 Supabase, 21st 또는 다른 API 키가 필요하지 않다. React/ReactDOM 19는 소비 앱의 peer이며, Next 15/16과 next-intl 4는 호환 경로에 필요한 선택적 peer다. next-themes 0.4와 tailwind-merge 3은 공통 런타임 의존성으로 설치된다. 사이트의 Supabase·MDX·Three 의존성과 코드는 공통 소비 경계에서 제외했다.
18
18
 
19
- 버전을 생략한 설치는 registry의 latest 태그를 따른다. 이 안내와 동일한 경계를 사용하려면 0.6.0을 명시하거나 같은 버전의 검증된 로컬 archive를 사용한다. 업그레이드 전에 [변경 기록](../../CHANGELOG.md)을 확인한다.
19
+ 버전을 생략한 설치는 registry의 latest 태그를 따른다. 2026-10-23에 latest는 0.7.1로 확인했다. 검증한 버전을 유지하려면 0.7.1을 명시한다. 업그레이드 전에 [변경 기록](../../CHANGELOG.md)을 확인한다.
20
20
 
21
21
  Tailwind 4를 사용하는 앱의 전역 CSS에서 공통 스타일을 한 번 불러온다.
22
22
 
@@ -80,7 +80,7 @@ Next.js 소비자는 layout의 metadata title 기본값/템플릿과 페이지
80
80
 
81
81
  ## 앱 전체 틀과 콘텐츠 폭
82
82
 
83
- 실제 naeil.dev 브랜드 헤더를 이어받는 앱은 선택적 React 전용 `@naeil/ui/naeil-header`의 `NaeilHeader`를 사용한다. 전체 프로젝트 메뉴·헤더 번역·테마/선택적 언어 컨트롤·toolbar·반응형 스타일을 한 모듈에서 제공하므로 소비 앱에 다시 복사하지 않는다. 소비 앱은 기존 theme provider, 라우팅·저장 guard, 현재 언어와 실제 인증 슬롯을 연결한다. 언어 변경을 지원하지 않으면 `onLocaleChange`를 생략한다. [전체 헤더 계약](../components/naeil-header.md)을 참조한다.
83
+ 실제 naeil.dev 브랜드 헤더를 이어받는 앱은 선택적 React 전용 `@naeil/ui/naeil-header`의 `NaeilHeader`를 사용하고, 소유 서비스 푸터는 `@naeil/ui/naeil-footer`의 `NaeilFooter`로 구성한다. 전체 프로젝트 메뉴·헤더 번역·테마/선택적 언어 컨트롤·toolbar·반응형 스타일과 canonical 푸터 목적지를 소비 앱에 다시 복사하지 않는다. 소비 앱은 기존 theme provider, 라우팅·저장 guard와 현재 언어를 연결한다. `authSlot`에는 같은 모듈의 `NaeilHeaderAccountControl`을 두고 실제 세션 상태·busy·guarded logout 콜백을 전달한다. pending 상태와 요청 잠금은 헤더 위에서 소유해 데스크톱/모바일 슬롯이 공유한다. 언어 변경을 지원하지 않으면 `onLocaleChange`를 생략한다. [전체 헤더 계약](../components/naeil-header.md)과 [푸터 계약](../components/naeil-footer.md)을 참조한다.
84
84
 
85
85
  2026-10-16 승인한 기본 프레임은 최대 1600px(여백 포함), 좌우 `clamp(16px, 2.4vw, 40px)`다. 브랜드 헤더·범용 Navigation·SiteFooter·본문 `.ui-app-frame`이 `--ui-width-frame`, `--ui-frame-gutter`를 함께 사용한다. 브랜드 헤더의 고정 높이는 65px이므로 main·sticky 영역과 초점/anchor 이동에 `calc(var(--ui-navigation-height) + 1px)`만큼 여유를 둔다. 다섯 장식 이미지는 공식 `https://naeil.dev/images/*.png` URL을 참조하므로 네트워크가 필요하다. 이미지 바이트는 npm에 포함하지 않으며 재배포 출처·권리 미해결 사항은 [제3자 고지](../../THIRD_PARTY_NOTICES.md)에 유지한다.
86
86
 
@@ -120,6 +120,7 @@ import { Navigation, SiteFooter } from "@naeil/ui/ui";
120
120
 
121
121
  - 주요 경로를 같은 조건에서 비교한다. 메뉴 좌표와 여백, 제목·행동의 정렬을 확인하고 의도적인 차이는 이유를 남긴다.
122
122
  - 제품이 지원하는 언어, 긴 이름, 적은/많은 데이터, 영향을 받는 로딩·오류 상태를 포함한다. 공유 컴포넌트 예시는 기존 한글·영문·일문 기준을 유지한다.
123
+ - 인증 전·후, 계정 메뉴, 로그아웃 busy·취소·실패·재시도를 확인한다. pending 중 모바일 메뉴 재열기나 화면 폭 변경으로 중복 요청이 발생하지 않아야 한다. 익명 화면만으로 인증된 헤더의 일치를 주장하지 않는다.
123
124
  - 페이지 넘침과 함께 표 내부 잘림·줄바꿈·조작 영역을 확인한다. 내부 스크롤 자체를 페이지 넘침과 혼동하지 않는다.
124
125
  - 기능 검사, 공통 기준 준수, 실제 화면 구성을 별도로 기록한다. 기존 대비·중첩 조작·터치 크기 문제는 현재 증거가 생기기 전까지 미해결로 남긴다.
125
126
 
@@ -156,7 +157,7 @@ Storybook의 로컬 폰트 import는 예시다. 그대로 앱 전역에 모든
156
157
 
157
158
  ## 개별 컴포넌트 안내
158
159
 
159
- [컴포넌트 사용 안내](../components/README.md)는 13개 primitive와 Navigation·SiteFooter·전체 NaeilHeader의 실제 wrapper API·기본값, 키보드, 상태, 레이블·오류 연결, 재정의 책임을 설명한다. 현재 로컬 Storybook은 UI 15개와 Brand 2개, 총 17개 Docs를 제공한다. 각 `Docs`·`Usage`와 `Brand / NaeilHeader / JapaneseApplication`에서 안내와 실행 예시를 확인한다. 이는 새 hosted Docs 배포 완료를 뜻하지 않는다. [지원 범위와 수동 점검](public-ui-support.md)은 자동 검사와 실제 보조 기술·운영체제 검증의 차이를 기록한다.
160
+ [컴포넌트 사용 안내](../components/README.md)는 13개 primitive와 Navigation·SiteFooter·NaeilFooter·전체 NaeilHeader 및 계정 컨트롤의 실제 API·기본값, 키보드, 상태, 레이블·오류 연결, 재정의 책임을 설명한다. Storybook 소스는 UI 15개와 Brand 2개, 총 17개 Docs를 제공한다. canonical 푸터 전체/축약형과 계정 상태는 기존 NaeilHeader/SiteFooter stories에 포함된다. 각 `Docs`·`Usage`와 `Brand / NaeilHeader / JapaneseApplication, ReferenceFull, ReferenceCompact, AccountStates`에서 안내와 실행 예시를 확인한다. 이는 새 hosted Docs 배포 완료를 뜻하지 않는다. [지원 범위와 수동 점검](public-ui-support.md)은 자동 검사와 실제 보조 기술·운영체제 검증의 차이를 기록한다.
160
161
 
161
162
  ## 확인 방법
162
163
 
@@ -169,7 +170,7 @@ Storybook의 로컬 폰트 import는 예시다. 그대로 앱 전역에 모든
169
170
 
170
171
  ## 0.3 package boundary
171
172
 
172
- The heading retains the original 0.3 migration anchor; the allowlist below reflects the 0.6.0 package boundary. `/ui` is the React core. The opt-in `/naeil-header` is the canonical complete branded header, also React-only. Root imports preserve Nav, Footer, Logo, LocaleSwitcher, ThemeProvider, ThemeToggle, ThemeToggleIcon, PageTitle, SectionTitle and their class helpers, but root has static Next/next-intl dependencies. React-only apps must use `/ui`, `/utils` and appropriate shared deep modules. `next-themes` is a React runtime library; it does not require Next.js. Fonts remain consumer-owned.
173
+ The heading retains the original 0.3 migration anchor; the boundary below includes published and registry-verified 0.7.1. `/ui` is the React core. Opt-in `/naeil-header` provides the canonical complete branded header and `NaeilHeaderAccountControl`; `/naeil-footer` provides canonical full/compact footers. Both are React-only. `/release` exports server-safe `uiRelease` metadata, without application artifact or environment data. Root imports preserve Nav, Footer, Logo, LocaleSwitcher, ThemeProvider, ThemeToggle, ThemeToggleIcon, PageTitle, SectionTitle and their class helpers, but root has static Next/next-intl dependencies. React-only apps must use the dedicated entries and appropriate shared deep modules. `next-themes` is a React runtime library; it does not require Next.js. Fonts remain consumer-owned.
173
174
 
174
175
  Next.js `^15 || ^16` and next-intl `^4` are optional peers. Install both when using root, Nav, Footer or `i18n/routing`. This is an existing compatibility contract, not a claim that every peer combination has browser validation; the clean Next fixture checks Next 16.1.7. React/ReactDOM `^19` come from the host. Tailwind 4 is the documented styling pipeline. Explicit `className`, Radix props, Toaster options and theme-provider props remain consumer overrides.
175
176
 
@@ -206,7 +207,7 @@ i18n/config
206
207
  i18n/routing
207
208
  ```
208
209
 
209
- `components/index` has the same framework requirements as root. `/utils` and `lib/utils` remain aliases for `cn`. `i18n/config` preserves the compatibility locale names; products may instead own their locale list and routing. There are no open-ended component/lib/i18n export patterns. Root, `/ui`, `/utils`, `/theme.css`, `/globals.css` and `/components.css` remain public; `/naeil-header` is the explicit new opt-in entry. It is not an open-ended component export pattern.
210
+ `components/index` has the same framework requirements as root. `/utils` and `lib/utils` remain aliases for `cn`. `i18n/config` preserves the compatibility locale names; products may instead own their locale list and routing. There are no open-ended component/lib/i18n export patterns. Root, `/ui`, `/utils`, `/theme.css`, `/globals.css` and `/components.css` remain public. `/naeil-header`, `/naeil-footer` and `/release` are explicit dedicated entries; they do not create open-ended component export patterns.
210
211
 
211
212
  Every excluded source path stays in this repository for the brand/example website. Move any local-source consumer use into the consumer application before upgrading:
212
213
 
@@ -214,7 +215,7 @@ Every excluded source path stays in this repository for the brand/example websit
214
215
  | --- | --- |
215
216
  | `components/nav-wrapper`, `components/nav-server-wrapper` | Use `/naeil-header` for the canonical whole header, or preserve Nav compatibility through your own adapter; your app loads users/sessions. |
216
217
  | `components/footer-wrapper` | Compose preserved Footer with your app's Link. |
217
- | `components/auth-slot` | App-owned account UI, logout action and avatar policy; pass it through Nav slots. |
218
+ | `components/auth-slot` | The app owns session state and guarded logout. Owned-service headers render `NaeilHeaderAccountControl` from `/naeil-header` in `authSlot`; legacy custom Nav slots remain compatible. |
218
219
  | `components/hero-scene`, `components/hero-section`, `components/paraglider-cursor` | Website scene/cursor source, assets and Three dependencies stay website-owned. |
219
220
  | `components/project-layout`, `components/workflow-diagram`, `components/accent-picker` | Website showcase/data/theme editing composition; use shared primitives in product-owned compositions. |
220
221
  | `components/blog/MarkdownRenderer`, `lib/blog` | Application-owned content rendering, filesystem and MDX/remark pipeline. |
@@ -1,12 +1,12 @@
1
1
  # Package verification and release policy
2
2
 
3
- The current implementation candidate is **@naeil/ui 0.7.0**, adding the canonical footer and release identity contract. It is unpublished and requires an explicit migration/release decision. The completed **0.6.0** [release record](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.6.0) remains the evidence for the published application frame; do not republish it. Verified 0.5.0, 0.4.0 and 0.3.0 evidence remains dated history. UI v2 names a design generation, not an npm major. Future breaking changes require an explicit migration and version decision. Version-scoped installation is in the [README](../README.md#use-the-ui).
3
+ **0.7.1 published and registry-verified — 2026-10-23.** Current registry baseline: **0.7.1**. This first published 0.7.x release includes canonical footer/release identity from the unpublished 0.7.0 candidate, plus shared account presentation. The owner authorized publication and the selected three-service continuous rollout; hosted Docs and standing activation require separate receipts. The completed [0.6.0 release](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.6.0) remains evidence for its published application frame. Verified 0.5.0, 0.4.0 and 0.3.0 evidence remains dated history. UI v2 names a design generation, not an npm major. Future breaking changes require an explicit migration and version decision. Version-scoped installation is in the [README](../README.md#use-the-ui).
4
4
 
5
5
  ## Architecture
6
6
 
7
- One repository contains the shared package and the separate Next.js brand/example website. `@naeil/ui/ui` provides React primitives and generic Navigation/SiteFooter. The opt-in React-only `@naeil/ui/naeil-header` provides the complete actual naeil.dev branded header; see [its consumer contract](components/naeil-header.md). The legacy root is a framework compatibility entry with static Next/next-intl imports, even when selecting only Logo or a heading; React-only consumers use the documented shared deep modules. Next and next-intl are optional peers, not optional behavior inside the root. Supply them when importing that entry, Nav, Footer, or i18n/routing. Theme controls and Toaster use the framework-independent React library next-themes, retained as a runtime dependency.
7
+ One repository contains the shared package and the separate Next.js brand/example website. `@naeil/ui/ui` provides React primitives and generic Navigation/SiteFooter. The opt-in React-only `@naeil/ui/naeil-header` provides the complete actual naeil.dev branded header and `NaeilHeaderAccountControl`; see [its consumer contract](components/naeil-header.md). Owned apps render that control in `authSlot` and supply session state, pending state and guarded callbacks above the header. The legacy root is a framework compatibility entry with static Next/next-intl imports, even when selecting only Logo or a heading; React-only consumers use the documented shared deep modules. Next and next-intl are optional peers, not optional behavior inside the root. Supply them when importing that entry, Nav, Footer, or i18n/routing. Theme controls and Toaster use the framework-independent React library next-themes, retained as a runtime dependency.
8
8
 
9
- Owned services use `@naeil/ui/naeil-footer` for the canonical localized destinations in full/compact variants; generic SiteFooter and legacy Footer retain their APIs. Footer navigation adapters preserve application save/flush decisions and modified-click behavior. `@naeil/ui/release` is server-safe metadata; it contains no application artifact, credential or environment. Applications compile their own allowlisted artifact/source identity. See [the footer contract](components/naeil-footer.md). The release coordinator remains disabled until its concrete policy, source mappings, immutable artifacts, deployment bridges and recovery targets are reviewed. Publishing a package, creating an update PR or merging it never establishes complete consumer rollout.
9
+ Owned services use `@naeil/ui/naeil-footer` for the canonical localized destinations in full/compact variants; generic SiteFooter and legacy Footer retain their APIs. Footer navigation adapters preserve application save/flush decisions and modified-click behavior. `@naeil/ui/release` is server-safe metadata; it contains no application artifact, credential or environment. Applications compile their own allowlisted artifact/source identity. See [the footer contract](components/naeil-footer.md). Current coordinator policy, selected services, activation and recovery evidence are maintained in the [rollout records](https://github.com/naeil-dev/naeil-ui/tree/main/docs/rollout); historical disabled-policy statements describe their dated checkpoints. Publishing a package, creating an update PR or merging it never establishes complete consumer rollout. Home Console is outside the selected shared-UI rollout.
10
10
 
11
11
  Website tools remain development dependencies so maintainers can develop both products. npm tarball consumers install only component runtime dependencies and their host React/ReactDOM. Build entries, package exports and packed checks constrain the public boundary. There is no bundled website action, Supabase helper, Three/hero/cursor module, blog engine or full application message catalog. The opt-in header includes only its three header dictionaries and canonical project catalog. Its five decorative images reference official `https://naeil.dev/images/*.png` URLs and require network access; no image bytes are bundled, and unresolved artwork redistribution provenance remains in [third-party notices](../THIRD_PARTY_NOTICES.md).
12
12
 
@@ -42,7 +42,7 @@ NAEIL_UI_EXPECTED_ARCHIVE_SHA256=FULL_LOWERCASE_SHA256 pnpm check:package
42
42
 
43
43
  Each check hashes its actual `npm pack` output and prints the digest. An unset expectation preserves normal development checks; a defined malformed or mismatched digest fails. Record matching boundary and clean React/Next results against the final archive, then reconcile package metadata, source revision and the consumer lock/archive identities. A provisional pack pass does not verify later documentation or archive bytes.
44
44
 
45
- CI runs these checks and a separate actual Storybook/browser job. Configured browser projects run Chromium, Firefox and WebKit in CI. Local Chromium/WebKit results and the Firefox environment launch block are distinguished in the [current support matrix](design/public-ui-support.md) and [dated Stage 3 verification](design/public-ui-stage3-verification.md) and [Stage 4 extension verification](design/public-ui-stage4-verification.md); configured CI is not a recorded remote pass. Automated axe/keyboard checks are not manual screen-reader or native Safari certification. The website build checks compatibility independently from package consumption; fonts fetched through next/font may require network access. Supabase OAuth and deployed behavior remain separate checks.
45
+ CI runs these checks and a separate actual Storybook/browser job. Configured browser projects run Chromium, Firefox and WebKit in CI. Verification and manual Pages jobs use the pinned Playwright 1.63.0 image, mounted-directory ownership correction and a version/browser launch preflight before builds; CI does not download browsers or OS packages during those jobs. Local Chromium/WebKit results and the historical Firefox launch block remain distinguished in the [support matrix](design/public-ui-support.md), [dated Stage 3 verification](design/public-ui-stage3-verification.md) and [Stage 4 extension verification](design/public-ui-stage4-verification.md). Automated axe/keyboard checks are not manual screen-reader or native Safari certification. The website build checks compatibility independently from package consumption; fonts fetched through next/font may require network access. Supabase OAuth and deployed behavior remain separate checks.
46
46
 
47
47
  At baseline `bcf99fca3467ae2b1cd29d54fa24f2569fb6001c`, both [push CI](https://github.com/naeil-dev/naeil-ui/actions/runs/36945564443) and [PR CI](https://github.com/naeil-dev/naeil-ui/actions/runs/36945943651) passed package-and-site and failed the browser job. Linux Firefox application coverage passed in those runs. The [final correction follow-up](design/public-ui-final-verification.md) preserves that baseline and the initial local freeze evidence, then records independent scoped review approval and successful [push CI](https://github.com/naeil-dev/naeil-ui/actions/runs/36948276767) and [PR CI](https://github.com/naeil-dev/naeil-ui/actions/runs/36948280881) at exact correction commit `9f90493abb4fb1186c948084026c3f4c04074013`. The PR browser job passed 209 tests with 4 expected Firefox/WebKit forced-colors skips; package-and-site and optional helper checks passed. The downloaded CI preview also passed actual Chromium/WebKit subpath navigation/font checks. This acceptance applies to that source; [merged PR checks](https://github.com/naeil-dev/naeil-ui/pull/1/checks) retain the release-preparation checks. Subsequent documentation changes require their own verification. Publication and manual platform acceptance remain separate.
48
48
 
@@ -50,6 +50,24 @@ The explicit font-notice regression gate copies the real React fixture config in
50
50
 
51
51
  ## Publication and deployment
52
52
 
53
+ ### Verified 0.7.1 registry publication and maintained Docs — 2026-10-23
54
+
55
+ The published release preserves these immutable identities:
56
+
57
+ | Item | Identity |
58
+ | --- | --- |
59
+ | Package source and pushed `v0.7.1` tag | `32108fd8e1cb1db6dae24a09f3ca72ac9a91f618` |
60
+ | Frozen archive | `docs/rollout/frozen/naeil-ui-0.7.1.tgz` |
61
+ | Archive SHA-256 | `ecd656c595fd63516417eef58a5e2624d1f1bf928ba0465761292d05502ab3f8` |
62
+ | Archive size / contents | 167705 compressed bytes; 139 files; 904985 unpacked bytes |
63
+ | Chrome contract | 1, with matching frozen frame/account references |
64
+
65
+ The frozen archive was published directly with scripts disabled. npm records publication at `2026-10-23T01:14:11.387Z`; `latest` was verified as `0.7.1`. An independent [registry archive](https://registry.npmjs.org/@naeil/ui/-/ui-0.7.1.tgz) download matched the frozen SHA-256, SHA-1, SRI, length and contents. Do not build or pack maintained main and call it the same frozen release. Earlier exact-archive validation is retained in the [dated account-correction evidence](https://github.com/naeil-dev/naeil-ui/tree/main/docs/rollout/evidence/account-correction-2026-10-17). [CI run 39859416335](https://github.com/naeil-dev/naeil-ui/actions/runs/39859416335) passed at `041c3c4f61755eca422d9a5727b32adc8c02a1f4`, including 563 unit tests and 380 browser tests (5 and 4 expected skips respectively), contrast, package/site and consumer checks. Its rebuilt archive differs because maintained guides changed; that CI is current compatibility evidence, not byte-identical frozen validation.
66
+
67
+ The archive's bundled guides are an immutable preparation snapshot, including 0.6.0 installation copy. Release notes must point to maintained instructions. Deploy Docs from a separately reviewed commit containing current guidance, the `v0.7.1` link correction and the corrected manual workflow. Record that Docs SHA, workflow run, deployment and actual hosted checks separately; retain `v0.7.1` at the frozen package source.
68
+
69
+ Postpublication registry checks passed on 2026-10-23. Separate fresh React/Next fixtures installed exact `@naeil/ui@0.7.1` from npmjs with independent empty caches and no repository dependency symlinks; every installed file matched the frozen 139-file inventory in both fixtures. Types, production builds, public root/deep import boundaries, release/footer/account SSR and browser checks passed, including the React fixture's absence of Next/Supabase/Three. The retained `registry-receipt.json` and successful `npm-publication-verification.json` bind these checks to the frozen source/archive; the latter records `checkedAt: 2026-10-23T01:19:50.385Z`. At the 01:19 UTC registry checkpoint, the tag had been pushed and the Release draft prepared. GitHub Release publication, hosted Docs and standing activation require separate receipts; see the release assets and [current rollout runbook](https://github.com/naeil-dev/naeil-ui/blob/main/docs/rollout/standing-rollout.md). Native/manual, real OAuth and global service-discovery evidence retain their separate scopes and limits.
70
+
53
71
  ### 0.6.0 release scope — 2026-10-16
54
72
 
55
73
  The owner authorized publication and deployment of the shared 1600px frame, responsive gutters and navigation/footer adoption improvements. Use the exact reviewed source and frozen archive; record npm, GitHub Release, Pages and production results independently. Existing consumer applications need their own upgrade and composition migration. The minor increment marks the deliberate default-width change and added public frame tokens/class.
@@ -86,15 +104,15 @@ The immutable npm archive's bundled guides are the release-preparation snapshot.
86
104
 
87
105
  ### Release procedure
88
106
 
89
- Storybook resolves relative Markdown guide links against the release's `v0.6.0` source tag. The tag must point to the reviewed release source, and hosted verification checks that guide links resolve. Historical foundation/source-authority links remain at their original revisions. Freeze subsequent documentation changes separately from immutable release archives.
107
+ Maintained Storybook resolves relative Markdown guide links against `v0.7.1`, whose frozen package source is `32108fd8e1cb1db6dae24a09f3ca72ac9a91f618`. That tag is independent of the reviewed Docs deployment SHA. Hosted verification checks that the pinned links resolve; the unpublished `v0.7.0` tag is not a valid target. Historical foundation/source-authority links remain at their original revisions. Freeze subsequent documentation changes separately from immutable release archives.
90
108
 
91
109
  The authorized 0.3.0 release completed main merge, npm 0.3.0, a GitHub Release and hosted Docs as recorded above. The release maintainer performs external authentication and publication; documentation preparation does not itself execute those operations. The automatic verification workflow does not publish or deploy. Record native/manual observations with their actual scope and carry unrun checks as limitations; do not substitute automated WebKit/axe checks or publication authorization for human certification.
92
110
 
93
111
  The procedure preserves the distinction between preparation and external verification. Use the intended version in place of `VERSION`; future releases require their own authorization and frozen source/archive:
94
112
 
95
113
  1. Review the changelog, migration, dated verification and the [2026-10-02 native environment report](design/public-ui-release-validation.md). Its capability blockers leave all native/manual acceptance rows open and add no native component pass. Confirm maintained links, actual Storybook Docs/Usage and legal notices for the intended source. Record unresolved manual coverage without inventing passes.
96
- 2. Build and inspect a fresh archive with `npm pack --ignore-scripts --json --pack-destination /path/to/candidate`; preserve its SHA-256, file list and source revision outside the archive. Run boundary/relative-link checks and clean packed consumers with `NAEIL_UI_EXPECTED_ARCHIVE_SHA256` set to that digest; confirm both generated archives match the candidate.
97
- 3. Check registry availability for `@naeil/ui@VERSION` immediately before publication. Publish the verified candidate archive, then verify the registry version, integrity and dist-tag; a changelog or install command alone proves none of these.
114
+ 2. When freezing a new release, build and inspect an archive with `npm pack --ignore-scripts --json --pack-destination /path/to/candidate`; preserve its SHA-256, file list and source revision outside the archive. Run boundary/relative-link checks and clean packed consumers with `NAEIL_UI_EXPECTED_ARCHIVE_SHA256` set to that digest; confirm both generated archives match the candidate. For already frozen 0.7.1, rehash the existing file and retain its exact-archive evidence; maintained guide updates must not replace it.
115
+ 3. Check registry availability for `@naeil/ui@VERSION` immediately before publication. Publish the verified archive with `--ignore-scripts`, then independently verify registry version/time, integrity, dist-tag and archive bytes, followed by fresh exact-version registry consumers. If that version already exists, inspect equality rather than attempt overwrite; a changelog or install command alone proves none of these.
98
116
  4. Create the release tag/GitHub Release for the recorded source and retain version, artifact identity, validation scope and support limitations.
99
117
  5. Publish the reviewed Storybook artifact through the manual Pages workflow below. Verify the actual hosted URL, subpath Docs-to-Usage navigation, fonts and notices over HTTP before reporting it live.
100
118
 
@@ -104,7 +122,7 @@ npm publication, GitHub Releases, main merge and hosted Docs are distinct operat
104
122
 
105
123
  ## Storybook preview artifact
106
124
 
107
- `pnpm build:storybook` builds 17 actual Docs pages: 15 UI families (the 13 primitives plus Navigation and SiteFooter) and Brand / Logo and NaeilHeader. Interactive Usage examples include the complete branded header and its JapaneseApplication adapter. It copies generated documentation notices and approved canonical brand SVGs, bundles locally installed Pretendard/Noto Sans JP and disables Vite publicDir. The artifact check verifies real Docs/story entries, exact MIT/shadcn/font notices, brand references and absence of website public images/SVGs/HTML. It does not claim those excluded site assets have cleared rights.
125
+ `pnpm build:storybook` builds 17 actual Docs pages: 15 UI families (the 13 primitives plus Navigation and SiteFooter) and Brand / Logo and NaeilHeader. Interactive examples include the complete branded header, JapaneseApplication, canonical footer ReferenceFull/ReferenceCompact and AccountStates. Canonical footer/account examples live within existing stories, without a separate NaeilFooter Docs family. It copies generated documentation notices and approved canonical brand SVGs, bundles locally installed Pretendard/Noto Sans JP and disables Vite publicDir. The artifact check verifies real Docs/story entries, exact MIT/shadcn/font notices, brand references and absence of website public images/SVGs/HTML. It does not claim those excluded site assets have cleared rights.
108
126
 
109
127
  CI uploads `storybook-preview` after a successful build; it is a downloadable static artifact, not a hosted deployment. Download/unzip it and serve the extracted directory (containing index.html):
110
128
 
@@ -118,18 +136,19 @@ Run the command from this checkout after installing its dependencies. It serves
118
136
 
119
137
  ### Authorized GitHub Pages publication
120
138
 
121
- The public Docs destination [https://naeil-dev.github.io/naeil-ui/](https://naeil-dev.github.io/naeil-ui/) last completed [Pages run38737502303](https://github.com/naeil-dev/naeil-ui/actions/runs/38737502303) for0.5.0 source `04229adbecac302efbf50ab2b8a3a40edb0a04bb`, rechecked2026-10-16. Subsequent deployments belong to their release records. Pages uses `build_type=workflow` and a **github-pages** main-only deployment branch policy. See [workflow status](https://github.com/naeil-dev/naeil-ui/actions/workflows/publish-docs-manual.yml).
139
+ The public Docs destination [https://naeil-dev.github.io/naeil-ui/](https://naeil-dev.github.io/naeil-ui/) has recorded [Pages run 38737502303](https://github.com/naeil-dev/naeil-ui/actions/runs/38737502303) for 0.5.0 source `04229adbecac302efbf50ab2b8a3a40edb0a04bb`, rechecked 2026-10-16. Subsequent deployments belong to their release records; this preparation does not establish 0.7.1 hosted publication. Pages uses `build_type=workflow` and a **github-pages** main-only deployment branch policy. See [workflow status](https://github.com/naeil-dev/naeil-ui/actions/workflows/publish-docs-manual.yml).
122
140
 
123
141
  `.github/workflows/publish-docs-manual.yml` is an explicit `workflow_dispatch` recipe with no PR/push trigger. Pages is configured to use **GitHub Actions**; the **github-pages** environment permits deployment from main only. Run the authorized workflow from main with the exact reviewed source SHA; configuration alone does not establish a successful deployment. The workflow file does not enable Pages itself. A default-branch merge can separately invoke the brand site's existing Vercel integration; that production deployment and its asset/font provenance require separate handling.
124
142
 
125
- Select **Publish reviewed UI docs (manual only)** in Actions (or use the command below), supply the exact full reviewed source SHA and type `PUBLISH_REVIEWED_DOCS`. The job checks out that SHA, rebuilds/verifies its actual preview/notices, runs the configured three-engine browser suite, and deploys only the Pages artifact through its environment. Failed checks do not reach deploy. Native observations and remaining manual limitations belong in the release evidence; the workflow does not certify them.
143
+ Select **Publish reviewed UI docs (manual only)** in Actions (or use the command below), supply the exact full reviewed Docs source SHA and type `PUBLISH_REVIEWED_DOCS`. The job checks out that SHA, corrects mounted-directory ownership before the exact Git check, verifies preinstalled Chromium/Firefox/WebKit in the pinned Playwright image, rebuilds/verifies its actual preview/notices, runs the configured three-engine browser suite, and deploys only the Pages artifact through its environment. Failed checks do not reach deploy. Native observations and remaining manual limitations belong in the release evidence; the workflow does not certify them.
126
144
 
127
145
  ```sh
128
- # Release maintainer: replace with the exact frozen source commit.
129
- gh workflow run publish-docs-manual.yml -f reviewed_sha=FULL_REVIEWED_COMMIT_SHA -f confirmation=PUBLISH_REVIEWED_DOCS
146
+ # Release maintainer: dispatch the corrected workflow from main.
147
+ # For 0.7.1, reviewed_sha is the separately reviewed Docs commit, not 32108fd.
148
+ gh workflow run publish-docs-manual.yml --ref main -f reviewed_sha=FULL_REVIEWED_DOCS_COMMIT_SHA -f confirmation=PUBLISH_REVIEWED_DOCS
130
149
  ```
131
150
 
132
- After a 0.6.0 deployment, verify the manager and iframe under `/naeil-ui/`, all 15 UI and 2 Brand Docs pages, their Usage examples and NaeilHeader JapaneseApplication, canonical artwork and official image references, Docs links, local fonts and exact LICENSE/THIRD_PARTY_NOTICES/font notices. Retain the deployment URL, source SHA and observed HTTP/navigation results. Hosted Storybook uses simulated data and requires no Supabase project, design API key or external font server. Only the reviewed Storybook directory is uploaded; website public assets stay excluded.
151
+ After the 0.7.1 Docs deployment, verify the manager and iframe under `/naeil-ui/`, all 15 UI and 2 Brand Docs pages, their Usage examples, NaeilHeader JapaneseApplication, canonical footer full/compact destinations, and signed-out/signed-in/menu/busy account states. Check pinned `v0.7.1` guide links, canonical artwork and official image references, local fonts and exact LICENSE/THIRD_PARTY_NOTICES/font notices over HTTP. Retain the deployment URL, Docs source SHA, workflow run and observed results separately from the package source/tag. Hosted Storybook uses simulated data and requires no Supabase project, design API key or external font server. Only the reviewed Storybook directory is uploaded; website public assets stay excluded.
133
152
 
134
153
  Normal builds are network-independent after dependency installation. Vite collects notices for actual preview modules; checked-in manager notices conservatively cover named embedded packages and versions from Storybook 10.4.6's original source lock. `check-storybook` fails if a named embedded module lacks a full notice. Four vendored tiny modules have no embedded version in that lock/comments; their original npm notice source is explicitly marked, without an exact-version claim. The exact use-composed-ref@1.4.0 tarball/repository provides MIT metadata but no standalone notice; its metadata plus full declared terms are retained without inventing a year/holder. The client-only@0.0.1 React marker retains its exact metadata and the original React MIT notice. Other missing notices fail the build; no generic MIT fallback passes arbitrary packages.
135
154
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@naeil/ui",
3
- "version": "0.7.1",
3
+ "version": "0.7.2",
4
4
  "type": "module",
5
5
  "license": "MIT",
6
6
  "sideEffects": [