mokkun 0.1.5 → 0.2.0

package/dist/types/renderer/layouts/shell.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Layout "shell" — アプリシェル型（管理画面）
+ * app_header / app_navi を全幅で最上部に置き、本文は 12 カラムグリッドのカード群にする。
+ */
+import type { ScreenLayout } from './types';
+import './shell.css';
+export declare const shellLayout: ScreenLayout;

package/dist/types/renderer/layouts/types.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Screen Layout — 画面全体の骨格（ヘッダ・セクション・アクションの配置）。layout は shell のみ
+ */
+import type { ScreenDefinition, InputField, Action } from '../../types/schema';
+/** セクション1つ分の描画済み部品 */
+export interface RenderedSection {
+    id: string;
+    title: string;
+    icon?: string;
+    fieldsHtml: string;
+    publishToggleHtml: string;
+}
+/** レイアウト実装が利用できるヘルパー群 */
+export interface LayoutHelpers {
+    /** 画面タイトル＋説明文 */
+    renderScreenHeader(screen: ScreenDefinition): string;
+    /** app_header / app_navi のマウント先コンテナ */
+    renderAppLayoutContainers(screen: ScreenDefinition): string;
+    /** 任意のフィールド配列を描画 */
+    renderFields(fields: InputField[]): string;
+    /** 任意のアクション配列を描画 */
+    renderActions(actions: Action[]): string;
+    /** sections を部品に分解したもの（sections が無い画面では空配列） */
+    renderSections(screen: ScreenDefinition): RenderedSection[];
+    /** セクションIDを生成 */
+    generateSectionId(sectionName: string, index: number): string;
+    escapeHtml(text: string): string;
+}
+export interface ScreenLayout {
+    /** レイアウトID */
+    id: string;
+    /** 画面全体のHTMLを返す（`.screen` 要素を含むこと） */
+    render(screen: ScreenDefinition, helpers: LayoutHelpers): string;
+}

package/dist/types/renderer/screen-renderer.d.ts

@@ -0,0 +1,57 @@
+/**
+ * Screen Renderer
+ * 画面全体のレンダリングを担当
+ */
+import type { ScreenDefinition } from '../types/schema';
+import { AppHeader } from './components/app-header';
+import { AppNavi } from './components/app-navi';
+/**
+ * ウィザード画面をレンダリング
+ */
+export declare function renderWizardScreen(screen: ScreenDefinition, currentStepIndex?: number): string;
+/**
+ * セクションIDを生成（セクション名から安全なIDを生成）
+ */
+export declare function generateSectionId(sectionName: string, index: number): string;
+/**
+ * 通常画面をレンダリング（shell レイアウト固定）
+ */
+export declare function renderScreen(screen: ScreenDefinition): string;
+/**
+ * 画面コントローラーインターフェース
+ */
+export interface ScreenController {
+    /** AppHeaderインスタンス（存在する場合） */
+    appHeader?: AppHeader;
+    /** AppNaviインスタンス（存在する場合） */
+    appNavi?: AppNavi;
+    /** 全コンポーネントを破棄 */
+    destroy: () => void;
+}
+/**
+ * 画面をDOMにマウント
+ */
+export declare function mountScreen(container: HTMLElement, screen: ScreenDefinition): ScreenController;
+/**
+ * AppHeader / AppNavi のみをマウントする（renderScreen の文字列出力を使う呼び出し側用）
+ */
+export interface AppChromeController {
+    appHeader?: AppHeader;
+    appNavi?: AppNavi;
+    destroy: () => void;
+}
+export declare function mountAppChrome(container: HTMLElement, screen: ScreenDefinition): AppChromeController;
+/**
+ * ウィザード画面をDOMにマウント（ステップ管理付き）
+ */
+export declare function mountWizardScreen(container: HTMLElement, screen: ScreenDefinition, initialStep?: number): WizardController;
+/**
+ * ウィザードコントローラーインターフェース
+ */
+export interface WizardController {
+    getCurrentStep: () => number;
+    destroy: () => void;
+    goToStep: (step: number) => void;
+    nextStep: () => void;
+    prevStep: () => void;
+}

package/dist/types/renderer/utils/dom.d.ts

@@ -0,0 +1,29 @@
+/**
+ * DOM Utilities
+ * DOM操作のユーティリティ関数
+ */
+/**
+ * 要素を作成する
+ */
+export declare function createElement<K extends keyof HTMLElementTagNameMap>(tag: K, options?: {
+    className?: string;
+    attributes?: Record<string, string>;
+    textContent?: string;
+    children?: (HTMLElement | string)[];
+}): HTMLElementTagNameMap[K];
+/**
+ * 要素をクリアする
+ */
+export declare function clearElement(element: HTMLElement): void;
+/**
+ * 一意なIDを生成する
+ */
+export declare function generateId(prefix?: string): string;
+/**
+ * HTMLテキストをエスケープする
+ */
+export declare function escapeHtml(text: string): string;
+/**
+ * タブIDを検証・サニタイズする
+ */
+export declare function sanitizeTabId(id: string): string;

package/dist/types/renderer/utils/dummy-data.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Dummy Data Generator
+ * リピーター用のダミーデータ自動生成
+ */
+import type { InputField } from '../../types';
+/**
+ * フィールドタイプに応じたダミーデータを生成
+ */
+export declare function generateDummyData(field: InputField, index?: number): unknown;
+/**
+ * リピーターアイテム用のダミーデータセットを生成
+ */
+export declare function generateRepeaterItemDummyData(itemFields: InputField[], itemIndex: number): Record<string, unknown>;

package/dist/types/renderer/utils/field-helpers.d.ts

@@ -0,0 +1,90 @@
+/**
+ * Field Helper Utilities
+ * フォームフィールドレンダリング用の共有ヘルパー関数
+ */
+import type { InputField, SelectOption } from '../../types/schema';
+/**
+ * HTML特殊文字をエスケープ
+ *
+ * @param text - エスケープする文字列
+ * @returns エスケープされた文字列
+ */
+export declare function escapeHtml(text: string): string;
+/**
+ * SSR対応のHTMLエスケープ
+ * document が利用できない環境でも動作する
+ *
+ * @param text - エスケープする文字列
+ * @returns エスケープされた文字列
+ */
+export declare function escapeHtmlSafe(text: string): string;
+/**
+ * radio/checkbox グループの方向を決める。direction 指定があれば優先。
+ * 未指定なら 選択肢4個以下かつ全ラベル8文字以下(説明文なし)で horizontal。
+ */
+export declare function resolveGroupDirection(direction: 'horizontal' | 'vertical' | undefined, options: Array<{
+    label: string;
+    description?: string;
+}>): 'horizontal' | 'vertical';
+/** 入力欄ではないが見出しとしてラベルだけ残すタイプ（description は出さない） */
+export declare const HEADING_LABEL_TYPES: Set<string>;
+/**
+ * フィールドのラッパーHTML生成
+ *
+ * @param field - 入力フィールド定義
+ * @param content - フィールドのコンテンツHTML
+ * @returns ラッパー付きのHTML文字列
+ */
+export declare function createFieldWrapper(field: InputField, content: string): string;
+/**
+ * 共通属性を生成
+ *
+ * @param field - 入力フィールド定義
+ * @returns 属性文字列
+ */
+export declare function getCommonAttributes(field: InputField): string;
+/**
+ * 選択肢の配列を取得（文字列参照は未対応）
+ *
+ * @param options - 選択肢配列または参照文字列
+ * @returns 選択肢の配列
+ */
+export declare function getOptions(options: SelectOption[] | string): SelectOption[];
+/**
+ * ファイルサイズをフォーマット
+ *
+ * @param bytes - バイト数
+ * @returns フォーマットされたサイズ文字列
+ */
+export declare function formatFileSize(bytes: number): string;
+/**
+ * MIMEタイプから表示名を取得
+ *
+ * @param mimeType - MIMEタイプ文字列
+ * @returns 表示用のフォーマット名
+ */
+export declare function formatMimeType(mimeType: string): string;
+/**
+ * レベルに基づくデフォルトサイズを取得
+ *
+ * @param level - 見出しレベル (1-6)
+ * @returns サイズバリアント
+ */
+export declare function getDefaultSizeForLevel(level: 1 | 2 | 3 | 4 | 5 | 6): 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+/**
+ * 単位ラベルのマッピング
+ */
+export declare const unitLabels: Record<string, string>;
+/**
+ * ユーザー指定の class 値を検証して返す（英数字・_・-・空白のみ許可）
+ * 不正な値は undefined を返し、呼び出し側は無視する。
+ */
+export declare function safeClassName(value: unknown): string | undefined;
+/**
+ * 数値属性を生成する。有限な数値でない場合は空文字（属性なし）を返す。
+ */
+export declare function numAttr(name: string, value: unknown): string;
+/**
+ * 識別子（クラス名の一部や data 属性値）として使えるトークンだけを通す
+ */
+export declare function safeToken(value: unknown, fallback: string): string;

package/dist/types/renderer/utils/icons.d.ts

@@ -0,0 +1,13 @@
+/**
+ * アイコン名 → 絵文字/Unicode記号 のマップ
+ * YAML の `icon: "refresh"` のような名前指定を、文字列のまま表示せずに記号へ変換する。
+ */
+/**
+ * アイコン名を記号に変換する。未知の名前は空文字（文字列そのものは表示しない）。
+ * 既に絵文字などの非ASCII文字列が直接指定されている場合はそのまま返す。
+ */
+export declare function resolveIcon(name: string | undefined | null): string;
+/**
+ * アイコン用の <span> HTML を生成（未知の名前は空文字）
+ */
+export declare function renderIconHtml(name: string | undefined | null, className: string): string;

package/dist/types/renderer/utils/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Utility Functions Export
+ */
+export { createElement, clearElement, generateId } from './dom';
+export { generateDummyData, generateRepeaterItemDummyData } from './dummy-data';
+export { escapeHtml, escapeHtmlSafe, createFieldWrapper, getCommonAttributes, getOptions, formatFileSize, formatMimeType, getDefaultSizeForLevel, unitLabels, } from './field-helpers';

package/dist/types/renderer-v2/actions.d.ts

@@ -0,0 +1,30 @@
+/**
+ * アクションボタンと確認ダイアログ（modal-dialog）
+ * primaryAction: solid-fill lg / secondary: outline md / tertiary: text md / danger: --button-color を error 色に（mokkun-v2.css の .mk2-button--danger）
+ * 並び順（DADS）: tertiary が左端、secondary、primary が右端。DOM の順序をそのまま見た目にする（CSS で並べ替えない）
+ */
+import type { ActionPlacementV2, ActionV2, ListV2, SectionV2 } from '../types/schema-v2';
+import { type ViewContext } from './context';
+export interface PlacedAction {
+    action: ActionV2;
+    primary: boolean;
+    placement: ActionPlacementV2;
+}
+/** Section.actions（見出し行の操作）。現在のロールで表示するもの */
+export declare function sectionActions(section: SectionV2, ctx: ViewContext): ActionV2[];
+/** list.bulkActions（選択した行への操作）。現在のロールで表示するもの */
+export declare function bulkActions(list: ListV2, ctx: ViewContext): ActionV2[];
+/** 画面のアクションを配置先つきで列挙する。primary が先頭。placement 未指定の secondary は primary に揃える。現在のロールで表示するものだけ */
+export declare function collectActions(ctx: ViewContext): PlacedAction[];
+export declare function dialogId(ctx: ViewContext, action: ActionV2): string;
+/**
+ * 操作ボタン 1 つ。Section 内の操作（primary ではない）は extra で data-section / data-bulk を付ける。
+ * type: solid-fill は primary、text は tertiary、outline はそれ以外
+ */
+export declare function renderActionButton(ctx: ViewContext, action: ActionV2, type: 'solid-fill' | 'outline' | 'text', size: 'lg' | 'md', extra?: Record<string, string | boolean | undefined>): string;
+/** Section の操作（見出し行）。tertiary はテキスト、それ以外は outline md */
+export declare function renderSectionButton(ctx: ViewContext, action: ActionV2, sectionId: string): string;
+/** 指定した配置のアクション群。無ければ空文字 */
+export declare function renderActions(ctx: ViewContext, placement: ActionPlacementV2): string;
+/** action.confirm を持つアクションごとの <dialog>。静的 HTML に含め、mount 時にボタンから開く */
+export declare function renderDialogs(ctx: ViewContext): string;

package/dist/types/renderer-v2/app-shell.d.ts

@@ -0,0 +1,15 @@
+/**
+ * App 層: ヘッダー、グローバルナビ、パンくず、通知
+ */
+import type { NoticeVariantV2 } from '../types/schema-v2';
+import type { ViewContext } from './context';
+/** notification-banner（app.notifications / view.states 共通） */
+export declare function renderBanner(id: string, variant: NoticeVariantV2, message: string, dismissible?: boolean): string;
+/** 共通通知。現在のロールに向けたもので、掲示期限（until）が今日より前でないものだけ。id は定義順の通し番号 */
+export declare function renderNotifications(ctx: ViewContext): string;
+/** グローバルナビ: group が 1 項目ならリンク、複数ならサブメニューボタン + menu-list。現在地は aria-current="page" */
+export declare function renderGlobalNav(ctx: ViewContext): string;
+/** ヘッダー: 左にシステム名とアプリ名、右に利用者名とテナント名（utility-link） */
+export declare function renderHeader(ctx: ViewContext): string;
+/** パンくず: アプリ名 › グループ › 画面タイトル */
+export declare function renderBreadcrumb(ctx: ViewContext): string;

package/dist/types/renderer-v2/condition.d.ts

@@ -0,0 +1,19 @@
+/**
+ * 条件（visibleWhen / requiredWhen）の評価。静的描画（既定値）と mount 後（DOM の現在値）で共有する。
+ *
+ * 比較の対象は「項目の現在値のトークン」: 単一値は文字列、複数選択は選択値の配列、
+ * 真偽値系（checkbox / toggle）は 'true' / 'false'、date は `y-m-d`（precision: month は `y-m`）。
+ */
+import type { ConditionV2 } from '../types/schema-v2';
+export type Token = string | string[];
+/** data 属性に載せる条件（JSON）。equals / notEquals / in のうち書かれたものだけ */
+export declare function serializeCondition(cond: ConditionV2): string;
+/** 条件を評価する。equals は一致、notEquals は不一致、in は配列のどれかと一致 */
+export declare function matchesCondition(token: Token, cond: ConditionV2): boolean;
+/**
+ * date の値のトークン。年・月・日を 0 埋めして `-` でつなぎ、末尾の空の部分は落とす
+ * （年月だけなら `2026-11`、全部空なら空文字）。静的描画（既定値）と mount 後（入力欄）で同じ形にするための唯一の組み立て
+ */
+export declare function dateToken(year: string, month: string, day: string): string;
+/** 値の文字列（YYYY-MM-DD / YYYY-MM）から date のトークンを作る。precision: month は日を無視する。解釈できない値はそのまま */
+export declare function dateTokenOf(text: string, precision: 'day' | 'month' | undefined): string;

package/dist/types/renderer-v2/context.d.ts

@@ -0,0 +1,37 @@
+/**
+ * v2 レンダラー内部で共有する描画文脈
+ */
+import type { ConditionV2, FieldV2, FlowV2, MokkunV2Schema, ViewV2 } from '../types/schema-v2';
+/** view の状態（ビューアーの「状態」切替）。normal は状態バナーなし */
+export type V2ViewState = 'normal' | 'success' | 'error' | 'empty' | 'loading';
+export declare const V2_VIEW_STATES: readonly V2ViewState[];
+/** 描画オプション */
+export interface V2RenderOptions {
+    /** 表示する状態。既定 normal（状態バナーを出さない） */
+    state?: V2ViewState;
+    /** 現在のロール（app.roles の値）。未指定は全ロール分を表示する */
+    role?: string;
+    /** 通知の期限（Notice.until）判定に使う今日。既定は実行時の日付（テスト用） */
+    today?: Date | string;
+}
+export interface ViewContext {
+    schema: MokkunV2Schema;
+    viewName: string;
+    view: ViewV2;
+    /** 展開後の項目 id → 項目定義（visibleWhen の初期評価用） */
+    fields: Map<string, FieldV2>;
+    state: V2ViewState;
+    role: string | undefined;
+    /** 今日（YYYY-MM-DD） */
+    today: string;
+}
+export declare function createContext(schema: MokkunV2Schema, viewName: string, options?: V2RenderOptions): ViewContext | undefined;
+/** DOM id は view 名で前置して、ページ内で一意にする */
+export declare function domId(ctx: ViewContext, ...parts: Array<string | number>): string;
+/** 条件を既定値で評価する（条件がなければ true）。参照先が無ければ false */
+export declare function isInitiallyVisible(cond: ConditionV2 | undefined, ctx: ViewContext): boolean;
+/** view を含み、手順ナビを出す flow（progress: none は除く） */
+export declare function findFlow(schema: MokkunV2Schema, viewName: string): {
+    flow: FlowV2;
+    index: number;
+} | undefined;

package/dist/types/renderer-v2/fields/choice.d.ts

@@ -0,0 +1,12 @@
+/**
+ * radio / checkbox の fieldset と、それを使う select の変種
+ * - radio: radio の fieldset
+ * - checkbox: checkbox 1 つ / multiple は checkbox の fieldset
+ * - select multiple: checkbox の fieldset（DADS の指針: 複数選択はチェックボックス）
+ * - select segmented: radio の横並び fieldset
+ */
+import { type Ctl } from './control-label';
+export declare function renderRadio(c: Ctl, inline?: boolean): string;
+export declare function renderCheckboxGroup(c: Ctl): string;
+/** 単一チェックボックス: ラベルはチェックボックス自身（必須表示も同じ行に） */
+export declare function renderCheckbox(c: Ctl): string;

package/dist/types/renderer-v2/fields/control-label.d.ts

@@ -0,0 +1,57 @@
+/**
+ * form-control-label（DADS）でのラップ
+ * 単一コントロールは <label for>、複数コントロール（グループ）は <fieldset> + <legend>。
+ * サポートテキスト・エラーテキストは aria-describedby で関連付ける。
+ */
+import type { FieldV2 } from '../../types/schema-v2';
+/** 1 項目の描画入力（DOM id / name は呼び出し側で繰り返しグループの添字まで解決済み） */
+export interface FieldOpts {
+    /** コントロールの DOM id（view 名で前置済み） */
+    domId: string;
+    /** フォーム送信名 */
+    name: string;
+    /** 初期表示で非表示にするか（visibleWhen を既定値で評価した結果） */
+    hidden?: boolean;
+    /**
+     * props.error（項目のエラー文）を描くか。既定 true（単体で呼ぶとき）。View の描画では状態が error のときだけ true
+     * （通常の状態ではエラーを出さない）
+     */
+    showError?: boolean;
+    /** 初期表示で必須か（requiredWhen を既定値で評価した結果）。省略は field.required */
+    required?: boolean;
+}
+/** コントロール描画用の文脈 */
+export interface Ctl {
+    f: FieldV2;
+    domId: string;
+    name: string;
+    hidden: boolean;
+    /** 必須として扱うか（requiredWhen のときは条件の評価結果。mount 後は DOM が追随する） */
+    required: boolean;
+    supportId?: string;
+    errorId?: string;
+    error?: string;
+    /** aria-describedby に入れる id 列（エラー → サポートの順） */
+    describedBy?: string;
+    /** 初期値 */
+    value: unknown;
+}
+export declare function makeCtl(f: FieldV2, o: FieldOpts): Ctl;
+/** サポートテキストの行（help / ファイル形式と容量 / whyRequired / format / example）。placeholder は使わない */
+export declare function supportLines(f: FieldV2): string[];
+/** aria-invalid / aria-describedby の共通属性 */
+export declare function ariaAttrs(c: Ctl): string;
+/** form-control-label 共通のエラー（各コントロールが専用のエラーテキストを持たない場合） */
+export declare function groupError(c: Ctl): string;
+/** 単一コントロール: <div> + <label for> */
+export declare function wrapSingle(c: Ctl, control: string): string;
+/** グループ: <fieldset> + <legend>。aria-describedby は fieldset に付ける */
+export declare function wrapGroup(c: Ctl, control: string, extra?: Record<string, string | boolean | undefined>, opts?: {
+    skipError?: boolean;
+}): string;
+/** ラベルを持たない表示用コントロール（チップ・タイムライン等）用のラップ */
+export declare function wrapDisplay(c: Ctl, control: string): string;
+/** 単一チェックボックス用: ラベルはチェックボックス自身が持つ（必須表示はその中に入れる） */
+export declare function wrapInline(c: Ctl, control: string): string;
+/** 必須／任意の表示（単一チェックボックスのラベル内で使う） */
+export declare function requirementHtml(c: Ctl): string;

package/dist/types/renderer-v2/fields/date.d.ts

@@ -0,0 +1,6 @@
+/**
+ * date → date-picker（consolidated）/ inline のときは calendar
+ * DADS の date-picker は 年・月・日 の 3 入力。カレンダーのポップオーバーは JS が必要なため出さない。
+ */
+import { type Ctl } from './control-label';
+export declare function renderDate(c: Ctl): string;

package/dist/types/renderer-v2/fields/display.d.ts

@@ -0,0 +1,22 @@
+/**
+ * 表示系: badge / chip / status → chip-label、timeline → list、map → image 枠
+ */
+import type { FieldV2 } from '../../types/schema-v2';
+import { type Ctl } from './control-label';
+/** badge / chip / status。値があれば項目名 + チップ、無ければチップのみ（ラベルを二重に出さない） */
+export declare function renderChip(c: Ctl): string;
+export interface TimelineRow {
+    time: string;
+    title: string;
+    description?: string;
+}
+/**
+ * timeline の行。value（{ at, label, text? }[]）を優先し、なければ props.items（{ time, title, description? }[]）
+ */
+export declare function timelineRows(f: FieldV2): TimelineRow[];
+/** 日時・ラベル・本文の順序なしリスト。readonly の値としても使う */
+export declare function timelineList(f: FieldV2, labelledBy?: string): string;
+/** timeline（value の { at, label, text? }[]、または props.items） */
+export declare function renderTimeline(c: Ctl): string;
+/** 地図は image の枠に「地図」プレースホルダー */
+export declare function renderMap(c: Ctl): string;

package/dist/types/renderer-v2/fields/file-support.d.ts

@@ -0,0 +1,15 @@
+/**
+ * file の accept / multiple / maxSize と、サポートテキストへの自動追記
+ */
+import type { FieldV2 } from '../../types/schema-v2';
+/** `<input accept>` の値 */
+export declare function acceptAttr(accept: FieldV2['accept']): string | undefined;
+/** 形式名（「PDF・JPEG・PNG」の形） */
+export declare function acceptLabel(accept: FieldV2['accept']): string | undefined;
+/** 複数選択か（first-class の multiple。props.multiple も受け付ける） */
+export declare function isMultiple(f: FieldV2): boolean;
+/**
+ * サポートテキストに自動で足す「形式: …／1ファイル 10MB まで」。
+ * help が形式名・容量をすでに書いているときは、その部分を足さない（重複させない）。
+ */
+export declare function fileSupportLine(f: FieldV2): string | undefined;

package/dist/types/renderer-v2/fields/file.d.ts

@@ -0,0 +1,9 @@
+/**
+ * file → file-upload / photo_grid → file-upload + 画像グリッド
+ * DADS の file-upload は JS（カスタム要素）で一覧を更新する。選択ボタンと一覧更新は mount.ts で行う。
+ */
+import { type Ctl } from './control-label';
+/** file-upload は label が for で input を指す。ボタンのラベル参照用に label へ id を付ける */
+export declare function renderFile(c: Ctl): string;
+/** 画像グリッド（props.photos: [{ src, alt }]）+ 追加用 file-upload */
+export declare function renderPhotoGrid(c: Ctl): string;

package/dist/types/renderer-v2/fields/index.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Field 層: component（と条件）から DADS 部品への振り分け
+ *
+ * | component | 条件 | DADS 部品 |
+ * |---|---|---|
+ * | text / number / time / duration / combobox | | input-text |
+ * | textarea | | textarea |
+ * | date | | date-picker（inline は calendar）|
+ * | file / photo_grid | | file-upload |
+ * | select | | select（multiple は checkbox、segmented は radio）|
+ * | radio / checkbox / toggle | | radio / checkbox / switch |
+ * | browser | | select（階層は optgroup）|
+ * | badge / chip / status | | chip-label |
+ * | timeline / map | | list / image |
+ */
+import type { FieldV2 } from '../../types/schema-v2';
+import { type FieldOpts } from './control-label';
+export type { FieldOpts } from './control-label';
+/** 1 項目を form-control-label でラップした HTML にする */
+export declare function renderFieldV2(field: FieldV2, opts: FieldOpts): string;

package/dist/types/renderer-v2/fields/select.d.ts

@@ -0,0 +1,17 @@
+/**
+ * select / browser（階層は optgroup）と、select の変種の振り分け
+ */
+import type { OptionV2 } from '../../types/schema-v2';
+import { type Ctl } from './control-label';
+interface BrowserItem {
+    value: string;
+    label: string;
+    children?: BrowserItem[];
+}
+export declare function option(o: OptionV2 | BrowserItem, current: string): string;
+/** select 1 つ（form-control-label の外側）。一覧セルの入力欄からも使う */
+export declare function selectControl(c: Ctl, body: string, ariaLabel?: string): string;
+export declare function renderSelect(c: Ctl): string;
+/** 階層を持つ項目は optgroup、持たない項目は option（props.items は { value, label, children? }） */
+export declare function renderBrowser(c: Ctl): string;
+export {};

package/dist/types/renderer-v2/fields/text.d.ts

@@ -0,0 +1,26 @@
+/**
+ * input-text 系: text / number / time / duration / combobox
+ */
+import { type Ctl } from './control-label';
+interface InputOpts {
+    type: string;
+    inputmode?: string;
+    list?: string;
+    min?: number;
+    max?: number;
+    step?: number;
+    /** 入力欄の後ろに付ける単位（同じ control の中） */
+    unit?: string;
+    /** ラベルを持たない場所（一覧セル）で使う aria-label */
+    ariaLabel?: string;
+}
+/** input-text 1 つ（form-control-label の外側）。一覧セルの入力欄からも使う */
+export declare function inputText(c: Ctl, o: InputOpts): string;
+export declare function renderText(c: Ctl): string;
+export declare function renderNumber(c: Ctl): string;
+export declare function renderTime(c: Ctl): string;
+/** 数値入力 + 単位（unit、なければ props.unit、既定「分」） */
+export declare function renderDuration(c: Ctl): string;
+/** input-text + datalist（候補は options のラベル） */
+export declare function renderCombobox(c: Ctl): string;
+export {};

package/dist/types/renderer-v2/fields/textarea.d.ts

@@ -0,0 +1,5 @@
+/**
+ * textarea
+ */
+import { type Ctl } from './control-label';
+export declare function renderTextarea(c: Ctl): string;

package/dist/types/renderer-v2/fields/toggle.d.ts

@@ -0,0 +1,6 @@
+/**
+ * toggle → switch（on-off）
+ * DADS の switch は JS で aria-checked を切り替える。クリック処理は mount.ts で行う。
+ */
+import { type Ctl } from './control-label';
+export declare function renderToggle(c: Ctl): string;

package/dist/types/renderer-v2/icons.d.ts

@@ -0,0 +1,35 @@
+/**
+ * DADS が使う SVG アイコン
+ * 取得元: design-system-example-components-html の各コンポーネント HTML（dads/NOTICE.md 参照）
+ */
+/** select / horizontal-menu の下向きシェブロン */
+export declare const chevronDown: (cls: string) => string;
+export declare const breadcrumbSeparator = "<svg class=\"dads-breadcrumb__separator-icon\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" aria-hidden=\"true\"><path d=\"M4.5 11L4 10.5L8 6.5L4 2.5L4.5 2L9 6.5L4.5 11Z\" fill=\"currentcolor\" /></svg>";
+export declare const accordionChevron = "<svg class=\"dads-accordion__icon-svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M3.3 7.3L12 16L20.7 7.3\" fill=\"none\" stroke=\"currentcolor\" stroke-width=\"2\"/></svg>";
+export declare const closeIcon = "<svg class=\"dads-notification-banner__close-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"m6.4 18.6-1-1 5.5-5.6-5.6-5.6 1.1-1 5.6 5.5 5.6-5.6 1 1.1L13 12l5.6 5.6-1 1L12 13l-5.6 5.6Z\" fill=\"currentcolor\"/></svg>";
+export declare const modalCloseIcon = "<svg class=\"dads-modal-dialog__close-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 120 120\" aria-hidden=\"true\"><path d=\"M32 95L25 88L53 60L25 32L32 25L60 53L88 25L95 32L67 60L95 88L88 95L60 67L32 95Z\" fill=\"currentcolor\"/></svg>";
+/** notification-banner の種別アイコン */
+export declare const bannerIcons: {
+    readonly 'info-1': "<svg class=\"dads-notification-banner__icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" role=\"img\" aria-label=\"インフォメーション\"><circle cx=\"12\" cy=\"12\" r=\"10\" fill=\"currentcolor\"/><circle cx=\"12\" cy=\"8\" r=\"1\" fill=\"Canvas\"/><path d=\"M11 11h2v6h-2z\" fill=\"Canvas\"/></svg>";
+    readonly success: "<svg class=\"dads-notification-banner__icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" role=\"img\" aria-label=\"成功\"><circle cx=\"12\" cy=\"12\" r=\"10\" fill=\"currentcolor\"/><path d=\"m17.6 9.6-7 7-4.3-4.3L7.7 11l2.9 2.9 5.7-5.6 1.3 1.4Z\" fill=\"Canvas\"/></svg>";
+    readonly warning: "<svg class=\"dads-notification-banner__icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" role=\"img\" aria-label=\"警告\"><path d=\"M1 21 12 2l11 19H1Z\" fill=\"currentcolor\"/><path d=\"M13 15h-2v-5h2v5Z\" fill=\"Canvas\"/><circle cx=\"12\" cy=\"17\" r=\"1\" fill=\"Canvas\"/></svg>";
+    readonly error: "<svg class=\"dads-notification-banner__icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" role=\"img\" aria-label=\"エラー\"><path d=\"M8.25 21 3 15.75v-7.5L8.25 3h7.5L21 8.25v7.5L15.75 21h-7.5Z\" fill=\"currentcolor\"/><path d=\"m12 13.4-2.85 2.85-1.4-1.4L10.6 12 7.75 9.15l1.4-1.4L12 10.6l2.85-2.85 1.4 1.4L13.4 12l2.85 2.85-1.4 1.4L12 13.4Z\" fill=\"Canvas\"/></svg>";
+};
+/** step-navigation の完了アイコン（DADS 原文のまま） */
+export declare const stepCompleted = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><circle cx=\"12\" cy=\"12\" r=\"12\" fill=\"#666\"/><path d=\"M10 17.5 19.8 8l-1.5-1.5-8.1 8-4.1-4L4.5 12l5.6 5.5Z\" fill=\"#fff\"/></svg>";
+export declare const pageNavPrev = "<svg class=\"dads-button__icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"m7.9 12 8-8-1.4-1.4L5.1 12l9.4 9.4 1.4-1.4z\" fill=\"currentcolor\"/></svg>";
+export declare const pageNavNext = "<svg class=\"dads-button__icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M9 2.6 7.6 4l8 8-8 8L9 21.4l9.4-9.4z\" fill=\"currentcolor\"/></svg>";
+/** table の並べ替えアイコン（none / ascending / descending） */
+export declare const sortIcons: {
+    readonly none: "M17 18.11L21.27 14L22 14.7L16.5 20L11 14.7L11.73 14L16 18.12V4H17V18.12ZM8 5.88L12.27 10L13 9.3L7.5 4L2 9.3L2.73 10L7 5.88V20H8V5.88Z";
+    readonly ascending: "M17 18.12L21.27 14L22 14.7L16.5 20L11 14.7L11.73 14L16 18.12V4H17V18.12ZM14 8.92L11.73 11L9 8.52V20H6V8.52L3.27 11L1 8.93L7.5 3L14 8.93Z";
+    readonly descending: "M7 5.88L2.73 10L2 9.3L7.5 4L13 9.3L12.27 10L8 5.88V20H7V5.88ZM10 15.08L12.27 13L15 15.48V4H18V15.48L20.73 13L23 15.07L16.5 21L10 15.07Z";
+};
+export declare const sortSvg: (path: string) => string;
+export declare const calendarPrev = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" role=\"img\" aria-label=\"\u524D\u306E\u6708\"><path d=\"m5.27 8 5.33-5.33-.93-.94L3.4 8l6.27 6.27.93-.94L5.27 8Z\" fill=\"currentcolor\" /></svg>";
+export declare const calendarNext = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" role=\"img\" aria-label=\"\u6B21\u306E\u6708\"><path d=\"m6 1.73-.93.94L10.4 8l-5.33 5.33.93.94L12.27 8 6 1.73Z\" fill=\"currentcolor\" /></svg>";
+export declare const switchCheck = "<svg class=\"dads-switch-on-off__icon\" viewBox=\"0 0 24 24\" width=\"24\" height=\"24\" aria-hidden=\"true\"><path d=\"m10.4 16.3-4.1-4.1 1.2-1.3 2.9 2.9 6-6.1 1.3 1.2z\" fill=\"currentcolor\"/></svg>";
+export declare const disclosureIcon = "<svg class=\"dads-disclosure__icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><circle cx=\"12\" cy=\"12\" r=\"11\" fill=\"currentcolor\"/><circle class=\"dads-disclosure__icon-circle\" cx=\"12\" cy=\"12\" r=\"8\" fill=\"currentcolor\"/><path class=\"dads-disclosure__icon-triangle\" d=\"M17 10H7L12 15L17 10Z\" fill=\"Canvas\"/></svg>";
+export declare const calendarButtonIcon = "<svg class=\"dads-date-picker__calendar-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" role=\"img\" aria-label=\"\u30AB\u30EC\u30F3\u30C0\u30FC\"><rect x=\"5\" y=\"10\" width=\"14\" height=\"10\" fill=\"Canvas\"/><path d=\"M9 16.5C7.62 16.5 6.5 15.38 6.5 14C6.5 12.62 7.62 11.5 9 11.5C10.38 11.5 11.5 12.62 11.5 14C11.5 15.38 10.38 16.5 9 16.5ZM5 22C3.9 22 3 21.09 3 20V6C3 4.91 3.91 4 5 4H6V2H8V4H16V2H18V4H19C20.09 4 21 4.91 21 6V20C21 21.09 20.09 22 19 22H5ZM5 20H19V10H5V20Z\" fill=\"currentcolor\"/></svg><svg class=\"dads-date-picker__calendar-chevron\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M12 17.1L3 8L4 7L12 15L20 7L21 8L12 17.1Z\" fill=\"currentcolor\" /></svg>";
+/** 新規タブで開くリンクのアイコン（上流 link/new-tab.html） */
+export declare const externalIcon = "<svg class=\"dads-link__icon\" width=\"16\" height=\"16\" viewBox=\"0 0 48 48\" role=\"img\" aria-label=\"\u65B0\u898F\u30BF\u30D6\u3067\u958B\u304D\u307E\u3059\"><path d=\"M22 6V9H9V39H39V26H42V42H6V6H22ZM42 6V20H39V11.2L21 29L19 27L36.8 9H28V6H42Z\" fill=\"currentcolor\"/></svg>";