@hjmds/design-contracts 0.8.2

package/README.md

@@ -0,0 +1,208 @@
+# `@hjmds/design-contracts`
+
+HJM 제품들이 함께 사용하는 플랫폼 중립 디자인 계약입니다. 밝고 간결한 정보 위계와
+결정적인 순간의 선명한 피드백을 공유하되, 특정 제품이나 도메인의 의미는 포함하지 않습니다.
+
+이 패키지는 **UI 컴포넌트 라이브러리가 아닙니다.** React element, React Native view,
+DOM event, focus trap 또는 navigation adapter를 렌더링하지 않고, 두 플랫폼 renderer가
+구현해야 할 토큰·recipe·상태·접근성 계약만 배포합니다. `@hjmds/react`와
+`@hjmds/react-native`는 같은 monorepo의 별도 패키지이며 contracts의 framework-neutral
+경계를 침범하지 않고 DOM/RN primitive로 번역합니다.
+
+> **조용한 화면 위에 중요한 순간만 선명하게.**
+
+상세 원칙은 [`docs/identity.md`](./docs/identity.md), 계층·지원 단계·확장 계획은
+[`docs/architecture.md`](./docs/architecture.md)에 정리되어 있습니다.
+외부 라이브러리에서 어떤 문제 분해 원칙만 가져오고 무엇을 복제하지 않는지는
+[`docs/library-reference-decisions.md`](./docs/library-reference-decisions.md)에 기록합니다.
+Toast의 queue·announcement·timer 수명주기는 [`docs/toast.md`](./docs/toast.md)에 별도로
+고정되어 있습니다.
+
+`badgeRecipe`은 Web/Native 공통 `filled | outline` variant를 정의하며 기본값은 기존과 같은
+`filled`입니다. renderer가 별도 색을 추측하지 않도록 outline 배경 정책, border fallback,
+강한 tone의 outline content 역할까지 계약에 포함합니다.
+Icon의 semantic name·RTL·장식/정보 접근성 경계는 [`docs/icon.md`](./docs/icon.md)에
+고정되어 있습니다.
+Tooltip의 Web hover/focus·provider·positioning 경계는
+[`docs/tooltip.md`](./docs/tooltip.md)에 고정되어 있습니다.
+BottomNavigation의 route source-of-truth와 adaptive renderer 경계는
+[`docs/bottom-navigation.md`](./docs/bottom-navigation.md)에 고정되어 있습니다.
+Link의 실제 목적지·Web anchor·Native router 경계는
+[`docs/link.md`](./docs/link.md)에 고정되어 있습니다.
+공통 계약을 Web과 Native에서 검증하는 showcase 규칙과 실행 방법은
+[`docs/showcase.md`](./docs/showcase.md)에 정리되어 있습니다.
+Ant Design 6.6.1 core 73개를 HJM의 canonical component scope로 번역한 crosswalk는
+[`docs/ant-design-coverage.md`](./docs/ant-design-coverage.md)에 정리되어 있습니다.
+v0.5의 Provider·typography·Showcase evidence 변경과 소비 절차는
+[`docs/migration-0.5.md`](./docs/migration-0.5.md)에 정리되어 있습니다.
+기존 `@hjm/design-system`에서 현재 패키지 이름과 granular export로 바꾸는 절차는
+[`docs/migration-0.6.md`](./docs/migration-0.6.md)에 정리되어 있습니다.
+
+## Showcase
+
+```bash
+pnpm install
+pnpm showcase:web       # Web Storybook
+pnpm showcase:web:check # story 계약과 타입 검사
+pnpm showcase:web:build # 배포 가능한 정적 Storybook
+```
+
+Web Storybook은 탐색 가능한 component home, foundation·catalog·환경 매트릭스를 보여주고, 실제 React Native
+renderer는 소비 앱의 on-device Storybook에서 같은 story identifier로 검증합니다.
+light/dark, LTR/RTL, 100–200% 글자 크기, reduced motion이 공통 필수 환경입니다.
+
+`compareShowcaseStoryIds`와 `assertShowcaseStoryIds`의 전체 inventory 검사는 모든 Stable/Beta
+컴포넌트를 제공한다고 선언한 first-party/full-coverage Storybook용 gate입니다. 일부 화면이나
+부분 채택 소비 앱은 이 gate를 사용하지 않고, 실제 실행한 story와 scenario만 versioned evidence
+artifact로 제출합니다.
+
+## 경계
+
+이 contracts 패키지가 소유하는 것:
+
+- light/dark 시맨틱 색상과 범용 강조색
+- spacing, radius, typography, glyph, motion, touch target, shadow, layout, layer
+- semantic color reference와 플랫폼 독립 resolver
+- button, surface, field 및 확장 컴포넌트의 typed recipe
+- shared/adaptive/web/native 범위와 stable/beta/planned/deprecated 상태를 담은 component catalog
+- 브랜드 그라디언트와 접근성 계약 테스트
+
+renderer 및 소비 앱 계층이 소유하는 것:
+
+- React DOM 또는 React Native 컴포넌트와 이벤트 타입 (`@hjmds/react`, `@hjmds/react-native`)
+- 제품별 저장 키와 사용자 설정 영속화
+- 아이콘 라이브러리, 폰트 로딩, 애니메이션 구현
+- 제품 전용 컴포넌트와 의미 매핑
+
+예를 들어 야구 팀 색상, 경기 상태, 스코어보드, 라인업, 야구장과 같은 야구 도메인
+UI는 Yajalal이 소유합니다. 다른 제품의 기능 상태 역시 각 제품이 범용 `AccentTone`에
+매핑합니다. 이 패키지에는 `react`, `react-native`, DOM 또는 Expo import를 추가하지
+않습니다.
+
+## 소비 원칙
+
+웹과 RN은 같은 토큰과 recipe를 읽고 각 플랫폼 renderer가 실제 UI primitive로
+번역합니다. 공유하는 것은 컴포넌트의 **의미와 계약**이지 렌더링 코드가 아닙니다.
+
+신규 recipe는 `slots`, `defaults`, `sizes`, `tones/variants`, `states`를 중심으로
+구성합니다. 외부 라이브러리에서는 컴포넌트 범위·anatomy·상호작용·접근성 패턴을
+참고하지만 제3자 외형, 전용 자산, 제품 의미는 복사하지 않습니다.
+
+확장 순서와 shared/adaptive/Web/Native 분류는
+[`docs/expansion-roadmap.md`](./docs/expansion-roadmap.md)에 기록합니다. 시각 recipe뿐 아니라
+`behaviorRegistry`의 키보드·포커스·접근성 scenario와 collection selection 계약을 함께
+만족해야 행동이 있는 컴포넌트가 구현된 것으로 봅니다.
+
+### RN/Metro 친화 진입점
+
+새 package의 root export는 기존 symbol API 호환을 위해 유지하지만 catalog·showcase·전체
+recipe graph까지 노출하므로 앱 runtime에서는 필요한 subpath를 우선합니다.
+
+| 진입점 | 용도 |
+| --- | --- |
+| `@hjmds/design-contracts/tokens` | 색·foundation·semantic reference 전체 |
+| `@hjmds/design-contracts/foundations` | spacing·type·motion·layout foundation만 |
+| `@hjmds/design-contracts/colors` | light/dark palette와 accent resolver만 |
+| `@hjmds/design-contracts/color-references` | semantic color reference 생성·해석기만 |
+| `@hjmds/design-contracts/responsive` | 공통 window class와 responsive value resolver |
+| `@hjmds/design-contracts/grid` | Web/RN 공통 Grid descriptor와 geometry resolver |
+| `@hjmds/design-contracts/recipes` | 공통 core component recipe |
+| `@hjmds/design-contracts/recipes/base` | Button·Surface·Field 최소 recipe graph |
+| `@hjmds/design-contracts/contracts` | renderer가 구현할 공통 anatomy/style 계약 |
+| `@hjmds/design-contracts/components/<name>` | `toast`, `form` 등 한 컴포넌트의 상태·validator |
+| `@hjmds/design-contracts/recipes/all` | planned를 포함한 전체 recipe; tooling용 |
+| `@hjmds/design-contracts/behaviors` | 전체 behavior registry; tooling용 |
+| `@hjmds/design-contracts/catalog` | maturity/catalog metadata; tooling용 |
+| `@hjmds/design-contracts/evidence` | versioned product evidence schema·validator; CI용 |
+| `@hjmds/design-contracts/version` | package graph 없이 현재 contract 버전만 읽는 runtime entry |
+| `@hjmds/design-contracts/showcase` | Storybook manifest와 evidence rule; CI용 |
+| `@hjmds/design-contracts/manifest.json` | JS runtime 없이 읽는 생성 manifest; CI용 |
+| `@hjmds/design-contracts/renderer-evidence.json` | first-party renderer claim과 scenario debt snapshot; CI용 |
+
+```ts
+import { spacing, typography } from "@hjmds/design-contracts/foundations";
+import { designSystemVersion } from "@hjmds/design-contracts/version";
+import { resolveContentStateAnnouncement } from "@hjmds/design-contracts/components/content-state";
+import { createToastStore } from "@hjmds/design-contracts/components/toast";
+```
+
+`pnpm bundle:check`는 각 진입점이 연결하는 ESM module 수와 raw/gzip 크기를 검사합니다.
+특히 token·단일 component 진입점에서 catalog/showcase/root module이 다시 유입되면 실패합니다.
+
+```ts
+import { THEMES } from "@hjmds/design-contracts/colors";
+import { radius, typography } from "@hjmds/design-contracts/foundations";
+import { buttonRecipe, type ButtonTone } from "@hjmds/design-contracts/recipes";
+
+const tone: ButtonTone = "primary";
+const contract = buttonRecipe.tones[tone];
+const colors = THEMES.light;
+
+const rendererInput = {
+  backgroundColor: contract.background
+    ? colors[contract.background]
+    : "transparent",
+  color: colors[contract.content],
+  borderRadius: radius.md,
+  ...typography.body,
+};
+```
+
+웹 renderer는 이를 CSS/CSS variable로 변환하고, RN renderer는 `StyleSheet`와
+`Pressable`로 변환합니다. 앱 화면에서 원시 색상·간격을 다시 선언하지 않습니다.
+v0.2 신규 recipe의 `ColorReference`는 제품 별칭이 아닌 공용 status palette로 풉니다.
+
+```ts
+import {
+  ACCENTS,
+  THEMES,
+  accentFill,
+  resolveColorReference,
+} from "@hjmds/design-contracts/tokens";
+import { badgeRecipe } from "@hjmds/design-contracts/recipes";
+
+const palette = {
+  theme: THEMES.dark,
+  statusAccents: ACCENTS.dark,
+  statusAccentFills: accentFill,
+};
+const successText = resolveColorReference(
+  badgeRecipe.tones.success.content,
+  palette,
+);
+```
+
+현재 소비 경계는 다음과 같습니다.
+
+- Yajalal RN은 `src/lib/theme` 어댑터 뒤에서 이 패키지를 직접 사용합니다.
+- BurnTok 웹/RN은 기존 `@burntok/design-system` import를 유지하며, 그 패키지가
+  공통 계약을 재수출하고 `ai` 제품 accent와 `built`, `rare`, `popular` 제품 의미만
+  매핑합니다. 공통 `ai` 아이콘 이름은 특정 제품 색이나 모델이 아니라 “AI 기능”을
+  나타내는 일반 의미 역할입니다.
+- 저장 키, CSS 변수 이름, KBO 구단/경기 상태 같은 제품 의미는 각 앱에 남습니다.
+
+## Git tag로 설치
+
+릴리즈 태그가 생성된 뒤 소비 저장소에서는 정확한 태그를 고정합니다.
+`v0.5.2`까지의 태그는 이전 package name을 담고 있습니다. 첫 rename release는 `v0.6.0`이며
+소비 저장소는 이전 이름과 새 이름을 동시에 두지 않고 한 변경에서 전환합니다.
+
+```bash
+pnpm add '@hjmds/design-contracts@git+https://github.com/jim1286/hjm-design-system.git#v<version>&path:/packages/design-contracts'
+```
+
+`<version>`은 설치할 fixed release의 정확한 SemVer로 바꿉니다.
+
+태그에는 `dist/` 빌드 결과를 함께 포함해야 합니다. 브랜치나 커밋되지 않은 로컬 경로에
+의존하지 않으며, 계약 변경은 SemVer로 배포합니다.
+
+## 개발
+
+```bash
+pnpm install
+pnpm check
+```
+
+`pnpm check`는 TypeScript typecheck, Vitest 계약/대비 테스트, 배포용 declaration 빌드,
+subpath import graph 예산 검사를 순서대로 실행합니다. 공개 토큰이나 recipe를 변경할 때는
+light/dark key 대칭, WCAG 대비, 최소 44 단위 터치 영역 테스트도 함께 갱신해야 합니다.

package/dist/alert-dialog.d.ts

@@ -0,0 +1,102 @@
+import type { AlertDialogTone } from "./component-recipes.js";
+export type AlertDialogMode = "alert" | "confirm";
+export type AlertDialogInitialFocus = "cancel" | "confirm";
+export type AlertDialogAsyncState = "idle" | "busy" | "error";
+export type AlertDialogConfirmAction = () => void | Promise<void>;
+export type AlertDialogCancelReason = "cancel-action" | "escape" | "back" | "programmatic" | "interrupted";
+export type AlertDialogDismissReason = Exclude<AlertDialogCancelReason, "interrupted"> | "outside";
+export type AlertDialogOpenChangeReason = "trigger" | "confirm" | AlertDialogCancelReason;
+export type AlertDialogResult = Readonly<{
+    outcome: "confirmed";
+}> | Readonly<{
+    outcome: "cancelled";
+    reason: AlertDialogCancelReason;
+}>;
+type AlertDialogAsyncAction = Readonly<{
+    onConfirm: AlertDialogConfirmAction;
+    fallbackErrorMessage: string;
+    resolveErrorMessage?: (error: unknown) => string;
+}> | Readonly<{
+    onConfirm?: never;
+    fallbackErrorMessage?: never;
+    resolveErrorMessage?: never;
+}>;
+type AlertDialogCopy = Readonly<{
+    title: string;
+    description: string;
+    confirmLabel: string;
+}>;
+/**
+ * Renderer-neutral copy and action contract. Products own localized copy;
+ * renderers own modal isolation, focus, motion, and visual translation.
+ */
+export type AlertDialogRequest = (AlertDialogCopy & Readonly<{
+    mode: "alert";
+    tone?: Extract<AlertDialogTone, "attention">;
+    cancelLabel?: never;
+    onConfirm?: never;
+    fallbackErrorMessage?: never;
+    resolveErrorMessage?: never;
+}>) | (AlertDialogCopy & Readonly<{
+    mode: "confirm";
+    tone?: AlertDialogTone;
+    cancelLabel: string;
+}> & AlertDialogAsyncAction);
+export type AlertDialogOpenState = Readonly<{
+    open: boolean;
+    defaultOpen?: never;
+    onOpenChange(open: boolean, detail: Readonly<{
+        reason: AlertDialogOpenChangeReason;
+    }>): void;
+}> | Readonly<{
+    open?: never;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean, detail: Readonly<{
+        reason: AlertDialogOpenChangeReason;
+    }>) => void;
+}>;
+export declare const alertDialogBehaviorDefaults: {
+    readonly initialFocus: {
+        readonly alert: "confirm";
+        readonly confirm: "cancel";
+    };
+    readonly outsideDismiss: false;
+    readonly escapeOrBackOutcome: "cancelled";
+    readonly dismissWhileBusy: false;
+};
+export declare function validateAlertDialogRequest(request: AlertDialogRequest): void;
+export declare function getAlertDialogInitialFocus(mode: AlertDialogMode): AlertDialogInitialFocus;
+export declare function canDismissAlertDialog(reason: AlertDialogDismissReason, busy: boolean): boolean;
+export type AlertDialogPhase = Readonly<{
+    status: "idle";
+}> | Readonly<{
+    status: "busy";
+}> | Readonly<{
+    status: "error";
+    message: string;
+}> | Readonly<{
+    status: "closing";
+    result: AlertDialogResult;
+}> | Readonly<{
+    status: "closed";
+    result: AlertDialogResult;
+}>;
+export type AlertDialogSession = Readonly<{
+    request: AlertDialogRequest;
+    result: Promise<AlertDialogResult>;
+    getSnapshot(): AlertDialogPhase;
+    subscribe(listener: () => void): () => void;
+    /** Returns true only for the attempt that moved the session toward closing. */
+    confirm(): Promise<boolean>;
+    cancel(reason: Exclude<AlertDialogCancelReason, "interrupted">): boolean;
+    attemptOutsideDismiss(): false;
+    completeExit(): boolean;
+    interrupt(): boolean;
+}>;
+/**
+ * Owns a complete AlertDialog lifecycle, including side-effect de-duplication
+ * and settling only after the renderer reports that exit motion completed.
+ */
+export declare function createAlertDialogSession(request: AlertDialogRequest): AlertDialogSession;
+export {};
+//# sourceMappingURL=alert-dialog.d.ts.map

package/dist/alert-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../src/alert-dialog.ts"],"names":[],"mappings":"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"}

package/dist/alert-dialog.js

@@ -0,0 +1,136 @@
+export const alertDialogBehaviorDefaults = {
+    initialFocus: { alert: "confirm", confirm: "cancel" },
+    outsideDismiss: false,
+    escapeOrBackOutcome: "cancelled",
+    dismissWhileBusy: false,
+};
+function assertCopy(value, field) {
+    if (value.trim().length === 0) {
+        throw new TypeError(`AlertDialog ${field} must not be empty`);
+    }
+}
+export function validateAlertDialogRequest(request) {
+    assertCopy(request.title, "title");
+    assertCopy(request.description, "description");
+    assertCopy(request.confirmLabel, "confirmLabel");
+    if (request.mode === "alert") {
+        if (request.tone === "danger") {
+            throw new TypeError("AlertDialog danger tone requires confirm mode");
+        }
+        return;
+    }
+    assertCopy(request.cancelLabel, "cancelLabel");
+    if (request.onConfirm)
+        assertCopy(request.fallbackErrorMessage, "fallbackErrorMessage");
+}
+export function getAlertDialogInitialFocus(mode) {
+    return alertDialogBehaviorDefaults.initialFocus[mode];
+}
+export function canDismissAlertDialog(reason, busy) {
+    if (busy && !alertDialogBehaviorDefaults.dismissWhileBusy)
+        return false;
+    if (reason === "outside")
+        return alertDialogBehaviorDefaults.outsideDismiss;
+    return true;
+}
+function resolveFailureMessage(request, error) {
+    if (!request.onConfirm)
+        return "";
+    try {
+        const resolved = request.resolveErrorMessage?.(error).trim();
+        return resolved || request.fallbackErrorMessage;
+    }
+    catch {
+        return request.fallbackErrorMessage;
+    }
+}
+/**
+ * Owns a complete AlertDialog lifecycle, including side-effect de-duplication
+ * and settling only after the renderer reports that exit motion completed.
+ */
+export function createAlertDialogSession(request) {
+    validateAlertDialogRequest(request);
+    let phase = { status: "idle" };
+    let settleResult;
+    let settled = false;
+    const listeners = new Set();
+    const result = new Promise((resolve) => {
+        settleResult = resolve;
+    });
+    const notify = () => {
+        for (const listener of listeners)
+            listener();
+    };
+    const transition = (next) => {
+        phase = next;
+        notify();
+    };
+    const settle = (next) => {
+        if (settled)
+            return false;
+        settled = true;
+        settleResult(next);
+        return true;
+    };
+    const session = {
+        request,
+        result,
+        getSnapshot: () => phase,
+        subscribe(listener) {
+            listeners.add(listener);
+            return () => listeners.delete(listener);
+        },
+        async confirm() {
+            if (phase.status !== "idle" && phase.status !== "error")
+                return false;
+            if (request.mode === "alert" || !request.onConfirm) {
+                transition({ status: "closing", result: { outcome: "confirmed" } });
+                return true;
+            }
+            transition({ status: "busy" });
+            try {
+                await request.onConfirm();
+                if (phase.status !== "busy")
+                    return false;
+                transition({ status: "closing", result: { outcome: "confirmed" } });
+                return true;
+            }
+            catch (error) {
+                if (phase.status !== "busy")
+                    return false;
+                transition({ status: "error", message: resolveFailureMessage(request, error) });
+                return false;
+            }
+        },
+        cancel(reason) {
+            if (!canDismissAlertDialog(reason, phase.status === "busy"))
+                return false;
+            if (phase.status !== "idle" && phase.status !== "error")
+                return false;
+            transition({ status: "closing", result: { outcome: "cancelled", reason } });
+            return true;
+        },
+        attemptOutsideDismiss() {
+            return false;
+        },
+        completeExit() {
+            if (phase.status !== "closing")
+                return false;
+            const finalResult = phase.result;
+            transition({ status: "closed", result: finalResult });
+            return settle(finalResult);
+        },
+        interrupt() {
+            if (phase.status === "closed")
+                return false;
+            const interrupted = {
+                outcome: "cancelled",
+                reason: "interrupted",
+            };
+            transition({ status: "closed", result: interrupted });
+            return settle(interrupted);
+        },
+    };
+    return session;
+}
+//# sourceMappingURL=alert-dialog.js.map

package/dist/alert-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog.js","sourceRoot":"","sources":["../src/alert-dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import type { AlertDialogTone } from \"./component-recipes.js\";\n\nexport type AlertDialogMode = \"alert\" | \"confirm\";\nexport type AlertDialogInitialFocus = \"cancel\" | \"confirm\";\nexport type AlertDialogAsyncState = \"idle\" | \"busy\" | \"error\";\nexport type AlertDialogConfirmAction = () => void | Promise<void>;\nexport type AlertDialogCancelReason =\n  | \"cancel-action\"\n  | \"escape\"\n  | \"back\"\n  | \"programmatic\"\n  | \"interrupted\";\nexport type AlertDialogDismissReason =\n  | Exclude<AlertDialogCancelReason, \"interrupted\">\n  | \"outside\";\nexport type AlertDialogOpenChangeReason = \"trigger\" | \"confirm\" | AlertDialogCancelReason;\n\nexport type AlertDialogResult =\n  | Readonly<{ outcome: \"confirmed\" }>\n  | Readonly<{ outcome: \"cancelled\"; reason: AlertDialogCancelReason }>;\n\ntype AlertDialogAsyncAction =\n  | Readonly<{\n      onConfirm: AlertDialogConfirmAction;\n      fallbackErrorMessage: string;\n      resolveErrorMessage?: (error: unknown) => string;\n    }>\n  | Readonly<{\n      onConfirm?: never;\n      fallbackErrorMessage?: never;\n      resolveErrorMessage?: never;\n    }>;\n\ntype AlertDialogCopy = Readonly<{\n  title: string;\n  description: string;\n  confirmLabel: string;\n}>;\n\n/**\n * Renderer-neutral copy and action contract. Products own localized copy;\n * renderers own modal isolation, focus, motion, and visual translation.\n */\nexport type AlertDialogRequest =\n  | (AlertDialogCopy &\n      Readonly<{\n        mode: \"alert\";\n        tone?: Extract<AlertDialogTone, \"attention\">;\n        cancelLabel?: never;\n        onConfirm?: never;\n        fallbackErrorMessage?: never;\n        resolveErrorMessage?: never;\n      }>)\n  | (AlertDialogCopy &\n      Readonly<{\n        mode: \"confirm\";\n        tone?: AlertDialogTone;\n        cancelLabel: string;\n      }> &\n      AlertDialogAsyncAction);\n\nexport type AlertDialogOpenState =\n  | Readonly<{\n      open: boolean;\n      defaultOpen?: never;\n      onOpenChange(\n        open: boolean,\n        detail: Readonly<{ reason: AlertDialogOpenChangeReason }>,\n      ): void;\n    }>\n  | Readonly<{\n      open?: never;\n      defaultOpen?: boolean;\n      onOpenChange?: (\n        open: boolean,\n        detail: Readonly<{ reason: AlertDialogOpenChangeReason }>,\n      ) => void;\n    }>;\n\nexport const alertDialogBehaviorDefaults = {\n  initialFocus: { alert: \"confirm\", confirm: \"cancel\" },\n  outsideDismiss: false,\n  escapeOrBackOutcome: \"cancelled\",\n  dismissWhileBusy: false,\n} as const satisfies Readonly<{\n  initialFocus: Record<AlertDialogMode, AlertDialogInitialFocus>;\n  outsideDismiss: false;\n  escapeOrBackOutcome: \"cancelled\";\n  dismissWhileBusy: false;\n}>;\n\nfunction assertCopy(value: string, field: string): void {\n  if (value.trim().length === 0) {\n    throw new TypeError(`AlertDialog ${field} must not be empty`);\n  }\n}\n\nexport function validateAlertDialogRequest(request: AlertDialogRequest): void {\n  assertCopy(request.title, \"title\");\n  assertCopy(request.description, \"description\");\n  assertCopy(request.confirmLabel, \"confirmLabel\");\n  if (request.mode === \"alert\") {\n    if (request.tone === (\"danger\" as AlertDialogTone)) {\n      throw new TypeError(\"AlertDialog danger tone requires confirm mode\");\n    }\n    return;\n  }\n  assertCopy(request.cancelLabel, \"cancelLabel\");\n  if (request.onConfirm) assertCopy(request.fallbackErrorMessage, \"fallbackErrorMessage\");\n}\n\nexport function getAlertDialogInitialFocus(\n  mode: AlertDialogMode,\n): AlertDialogInitialFocus {\n  return alertDialogBehaviorDefaults.initialFocus[mode];\n}\n\nexport function canDismissAlertDialog(\n  reason: AlertDialogDismissReason,\n  busy: boolean,\n): boolean {\n  if (busy && !alertDialogBehaviorDefaults.dismissWhileBusy) return false;\n  if (reason === \"outside\") return alertDialogBehaviorDefaults.outsideDismiss;\n  return true;\n}\n\nexport type AlertDialogPhase =\n  | Readonly<{ status: \"idle\" }>\n  | Readonly<{ status: \"busy\" }>\n  | Readonly<{ status: \"error\"; message: string }>\n  | Readonly<{ status: \"closing\"; result: AlertDialogResult }>\n  | Readonly<{ status: \"closed\"; result: AlertDialogResult }>;\n\nexport type AlertDialogSession = Readonly<{\n  request: AlertDialogRequest;\n  result: Promise<AlertDialogResult>;\n  getSnapshot(): AlertDialogPhase;\n  subscribe(listener: () => void): () => void;\n  /** Returns true only for the attempt that moved the session toward closing. */\n  confirm(): Promise<boolean>;\n  cancel(reason: Exclude<AlertDialogCancelReason, \"interrupted\">): boolean;\n  attemptOutsideDismiss(): false;\n  completeExit(): boolean;\n  interrupt(): boolean;\n}>;\n\nfunction resolveFailureMessage(\n  request: Extract<AlertDialogRequest, { mode: \"confirm\" }>,\n  error: unknown,\n): string {\n  if (!request.onConfirm) return \"\";\n  try {\n    const resolved = request.resolveErrorMessage?.(error).trim();\n    return resolved || request.fallbackErrorMessage;\n  } catch {\n    return request.fallbackErrorMessage;\n  }\n}\n\n/**\n * Owns a complete AlertDialog lifecycle, including side-effect de-duplication\n * and settling only after the renderer reports that exit motion completed.\n */\nexport function createAlertDialogSession(\n  request: AlertDialogRequest,\n): AlertDialogSession {\n  validateAlertDialogRequest(request);\n\n  let phase: AlertDialogPhase = { status: \"idle\" };\n  let settleResult!: (result: AlertDialogResult) => void;\n  let settled = false;\n  const listeners = new Set<() => void>();\n  const result = new Promise<AlertDialogResult>((resolve) => {\n    settleResult = resolve;\n  });\n\n  const notify = () => {\n    for (const listener of listeners) listener();\n  };\n  const transition = (next: AlertDialogPhase) => {\n    phase = next;\n    notify();\n  };\n  const settle = (next: AlertDialogResult): boolean => {\n    if (settled) return false;\n    settled = true;\n    settleResult(next);\n    return true;\n  };\n\n  const session: AlertDialogSession = {\n    request,\n    result,\n    getSnapshot: () => phase,\n    subscribe(listener) {\n      listeners.add(listener);\n      return () => listeners.delete(listener);\n    },\n    async confirm() {\n      if (phase.status !== \"idle\" && phase.status !== \"error\") return false;\n\n      if (request.mode === \"alert\" || !request.onConfirm) {\n        transition({ status: \"closing\", result: { outcome: \"confirmed\" } });\n        return true;\n      }\n\n      transition({ status: \"busy\" });\n      try {\n        await request.onConfirm();\n        if ((phase as AlertDialogPhase).status !== \"busy\") return false;\n        transition({ status: \"closing\", result: { outcome: \"confirmed\" } });\n        return true;\n      } catch (error) {\n        if ((phase as AlertDialogPhase).status !== \"busy\") return false;\n        transition({ status: \"error\", message: resolveFailureMessage(request, error) });\n        return false;\n      }\n    },\n    cancel(reason) {\n      if (!canDismissAlertDialog(reason, phase.status === \"busy\")) return false;\n      if (phase.status !== \"idle\" && phase.status !== \"error\") return false;\n      transition({ status: \"closing\", result: { outcome: \"cancelled\", reason } });\n      return true;\n    },\n    attemptOutsideDismiss() {\n      return false;\n    },\n    completeExit() {\n      if (phase.status !== \"closing\") return false;\n      const finalResult = phase.result;\n      transition({ status: \"closed\", result: finalResult });\n      return settle(finalResult);\n    },\n    interrupt() {\n      if (phase.status === \"closed\") return false;\n      const interrupted: AlertDialogResult = {\n        outcome: \"cancelled\",\n        reason: \"interrupted\",\n      };\n      transition({ status: \"closed\", result: interrupted });\n      return settle(interrupted);\n    },\n  };\n\n  return session;\n}\n"]}

package/dist/base-recipes.d.ts

@@ -0,0 +1,184 @@
+import { control, radius, spacing } from "./foundations.js";
+export type ButtonTone = "primary" | "secondary" | "ghost" | "danger" | "link";
+export type ButtonSize = keyof typeof control.buttonHeight;
+export type SurfaceTone = "default" | "raised" | "accent" | "subtle";
+export type SurfacePadding = "none" | keyof typeof spacing;
+export type SurfaceRadius = keyof typeof radius;
+export type FieldVariant = "surface" | "inset";
+export type FieldShape = "medium" | "large" | "full";
+/** Small renderer entry point for the three foundational visual recipes. */
+export declare const buttonRecipe: {
+    readonly slots: readonly ["root", "leading", "label", "trailing", "spinner"];
+    readonly defaults: {
+        readonly tone: "primary";
+        readonly size: "medium";
+    };
+    readonly tones: {
+        readonly primary: {
+            readonly background: "primary";
+            readonly content: "onPrimary";
+            readonly border: null;
+        };
+        readonly secondary: {
+            readonly background: "surfaceAlt";
+            readonly content: "text";
+            readonly border: "border";
+        };
+        readonly ghost: {
+            readonly background: null;
+            readonly content: "textMuted";
+            readonly border: null;
+        };
+        readonly danger: {
+            readonly background: "dangerFill";
+            readonly content: "onDanger";
+            readonly border: null;
+        };
+        readonly link: {
+            readonly background: null;
+            readonly content: "contentBrand";
+            readonly border: null;
+        };
+    };
+    readonly sizes: {
+        readonly small: {
+            readonly height: 36;
+            readonly hitSlop: 4;
+            readonly paddingHorizontal: 12;
+            readonly textVariant: "label";
+        };
+        readonly medium: {
+            readonly height: 44;
+            readonly hitSlop: 0;
+            readonly paddingHorizontal: 16;
+            readonly textVariant: "body";
+        };
+        readonly large: {
+            readonly height: 52;
+            readonly hitSlop: 0;
+            readonly paddingHorizontal: 20;
+            readonly textVariant: "bodyLarge";
+        };
+    };
+    readonly opacity: {
+        readonly disabled: 0.5;
+        readonly pressed: 0.86;
+    };
+};
+export declare const surfaceRecipe: {
+    readonly default: {
+        readonly background: "surface";
+        readonly border: "border";
+        readonly borderAlpha: 1;
+        readonly elevated: false;
+        readonly borderAlways: false;
+    };
+    readonly raised: {
+        readonly background: "bg";
+        readonly border: "border";
+        readonly borderAlpha: 1;
+        readonly elevated: true;
+        readonly borderAlways: false;
+    };
+    readonly accent: {
+        readonly background: "surfaceAccent";
+        readonly border: "primary";
+        readonly borderAlpha: 0.3;
+        readonly elevated: false;
+        readonly borderAlways: false;
+    };
+    readonly subtle: {
+        readonly background: "bg";
+        readonly border: "border";
+        readonly borderAlpha: 1;
+        readonly elevated: false;
+        readonly borderAlways: true;
+    };
+};
+export declare const fieldRecipe: {
+    readonly slots: readonly ["root", "label", "control", "leading", "input", "trailing", "hint", "error"];
+    readonly defaults: {
+        readonly variant: "surface";
+        readonly shape: "medium";
+    };
+    readonly variants: {
+        readonly surface: {
+            readonly background: "surface";
+        };
+        readonly inset: {
+            readonly background: "bg";
+        };
+    };
+    readonly shapes: {
+        readonly medium: "md";
+        readonly large: "lg";
+        readonly full: "full";
+    };
+    readonly states: {
+        readonly idle: {
+            readonly border: "textMuted";
+        };
+        readonly focused: {
+            readonly border: "contentBrand";
+        };
+        readonly invalid: {
+            readonly border: "danger";
+        };
+    };
+    readonly minHeight: 44;
+    readonly multilineMinHeight: 80;
+    readonly borderWidth: 1;
+    readonly focusRingWidth: 2;
+    readonly focusRingOffset: 2;
+    readonly paddingHorizontal: 16;
+    readonly paddingVertical: 12;
+    readonly textVariant: "body";
+    readonly label: {
+        readonly color: "textBody";
+        readonly textVariant: "body";
+        readonly fontWeight: "600";
+        readonly gap: 8;
+    };
+    readonly support: {
+        readonly hintColor: "textMuted";
+        readonly errorColor: "danger";
+        readonly textVariant: "label";
+        readonly gap: 6;
+    };
+    readonly placeholder: {
+        readonly color: "textMuted";
+    };
+    readonly disabledOpacity: 0.6;
+};
+/**
+ * Renderer-neutral Surface geometry. Tone colors stay in `surfaceRecipe` for
+ * compatibility; these axes make the previously implicit Web/Native defaults
+ * explicit without changing that public recipe shape.
+ */
+export declare const surfaceDefaults: {
+    readonly tone: "default";
+    readonly padding: "none";
+    readonly radius: "lg";
+    readonly bordered: false;
+};
+export declare const surfaceGeometry: {
+    readonly paddings: {
+        readonly xxs: 4;
+        readonly xs: 8;
+        readonly sm: 12;
+        readonly md: 16;
+        readonly lg: 20;
+        readonly xl: 24;
+        readonly xxl: 32;
+        readonly xxxl: 40;
+        readonly none: 0;
+    };
+    readonly radii: {
+        readonly sm: 8;
+        readonly md: 12;
+        readonly lg: 16;
+        readonly xl: 24;
+        readonly full: 999;
+    };
+};
+//# sourceMappingURL=base-recipes.d.ts.map

package/dist/base-recipes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-recipes.d.ts","sourceRoot":"","sources":["../src/base-recipes.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAc,MAAM,EAAE,OAAO,EAAc,MAAM,kBAAkB,CAAC;AAGpF,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAC/E,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,OAAO,CAAC,YAAY,CAAC;AAC3D,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;AACrE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,MAAM,OAAO,OAAO,CAAC;AAC3D,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,MAAM,CAAC;AAChD,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,OAAO,CAAC;AAC/C,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;AAErD,4EAA4E;AAC5E,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDxB,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsCzB,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+EvB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,eAAe;;;;;CAU3B,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;CAM3B,CAAC"}